Jed Bartausky:

Welcome back to another episode of the React Native Radio Podcast. Episode 358, React Native for Meta Quest with Evan Albert. Hey. Hey guys, it's Jed. Okay, so before we get into the episode, got to make an announcement real quick. Infinite Red is bringing back the Chain React conference. Super exciting and we're really stoked about it. We're going to be returning back to Portland, Oregon for a sixth year, and we're going to be co-hosting this year with our friends from Expo. And that's going to be on July 30th and 31st. Now, I know I might be a little biased, but I don't think you're going to want to miss what we've got going on this year. With the rise of agentic coding, we'll be taking on this whole new reality in a way that you've come to expect from Chain React. We'll have a blend of React Native and AI-driven talks so that you can get a feel for what's happening from some of the biggest names in the industry.

And if you're wanting to deliver a React Native talk, you're in luck. Our call for speakers is open until April 15th. We really want our React Native Radio fans to be there, so we've got a little gift for you — use RNR15 at checkout for 15% off. You can learn more and apply to speak by visiting chainreactconf.com. Hope to see you there. And now back to the episode.

Mazen Chami:

So Robin, I see you're wearing green for St. Patrick's Day.

Robin Heinze:

Yeah, I see you're not wearing green.

Mazen Chami:

I am. I am. This is green. It just doesn't come across as green. It's green. It's like a very dark green that's almost—

Robin Heinze:

I wish we could put an image in the show notes so I could show everyone that his shirt does not look green.

Mazen Chami:

I just turned on every single light. Presume it doesn't. This is green. This is like the whole blue — is it blue or is it gold dress thing all over again?

Robin Heinze:

I swear it looks gray to me, but I'm not colorblind like Jed, so you can take my word for it.

Mazen Chami:

Well, okay. Before we introduce you, Evan, our guest, is this green to you?

Evan Albert:

It looks gray to me, honestly.

Robin Heinze:

See? Okay. Thank you, Evan.

Mazen Chami:

All right. I'm going to post the poll on Twitter after this. I'm going to turn off all my lights now. It doesn't matter.

Robin Heinze:

You do have green plants behind you, so you do have green vibes in the room.

Mazen Chami:

Yeah. Yeah. Well, this one is not green. It's turned brown recently, but I'm working on it.

Robin Heinze:

Happy St. Patrick's Day, although you won't be listening to this on St. Patrick's Day, but we are recording it on St. Patrick's Day.

Mazen Chami:

It's close. Yeah. Close enough. Well, I'm Mazen, she's Robin, and we're React Native Radio. With us, we have Evan Albert. Evan, welcome to the show.

Evan Albert:

Hey, thanks for having me.

Mazen Chami:

Yeah, yeah. Could you please introduce yourself to our listeners?

Evan Albert:

Yeah, definitely. So I'm Evan, an engineering manager at Meta, and I oversee what we call the Android build path for Horizon OS. So for Android developers to be building apps and games for the Meta Quest.

Mazen Chami:

Awesome. Awesome. Yeah. For those of our listeners that don't know, Horizon OS is the Android OS version for the Meta Quest. Cool. Well, before we get into our topic, let's hear from our sponsor. Infinite Red is a premier React Native consultancy located fully remote in the US. We're a team of 30 senior-plus level React Native developers and support staff and have been doing this for over a decade. If you're looking for React Native expertise for your next project, hit us up at infinite.red/radio. Don't forget to mention that you heard about us through the React Native Radio podcast. Okay, let's get into our topic. This is React Native for Meta Quest, part two, what we're calling our developer-focused episode. For our listeners, if you haven't listened to the first episode, RNR 337 — you should definitely

Robin Heinze:

Go do that first.

Mazen Chami:

You should, yes. That was React Native with Marcus Landeckert. Jamon and Marcus had a good chat kind of setting what we say the topic of the product behind the Meta Quest.

Robin Heinze:

Yeah, it was very focused on the system itself and the product. Yeah.

Mazen Chami:

So pause this episode and listen to the other one and we'll be waiting.

Robin Heinze:

Jamon actually was so excited after recording that episode that he went out and bought a Meta Quest.

Mazen Chami:

Yeah. Sponsored by Meta Quest. Well, okay. We're going to hit pause. We're going to wait for our listeners to listen to the episode and we'll be back in 45 minutes. I'm kidding. I'm kidding. All right, Robin, you're up.

Robin Heinze:

Welcome back. If you just listened to 337. Yeah. So let's talk about the effort to bring React Native specifically to Meta Quest because that's why we're here is to talk about developing React Native apps for Meta Quest. Was there an aha moment that made it really clear that it was worth pursuing this?

Evan Albert:

Yeah. So I think as we've been building out this emerging Android build path — and what a lot of people don't know is that Horizon OS is just AOSP, so Android Open Source Project. So anything that runs on Android for the most part is just going to run on the Quest headset. And obviously Meta is the creator of React and React Native. So it just made a lot of sense for us to kind of explore that build path as well. And I think the realization that we had also is that React Native makes a ton of sense because I think React Native developers are also kind of used to the cross-platform, write once, run anywhere story.

Robin Heinze:

Yeah. Does this kind of fit into that vision of learn once, write anywhere?

Evan Albert:

Exactly. They're used to building for iOS, Android, and this is kind of just another platform. And it's different in some ways which we can kind of talk about, but for the most part, everything that you already know, all the tools that you already use translate nicely to developing for VR.

Robin Heinze:

I love when people try to run React Native on just the most random platforms just to prove that it's really, really agnostic — on a graphing calculator or something crazy. But yeah, that makes a ton of sense.

Mazen Chami:

I mean, it runs on a Kindle, so that is very random. It doesn't have the fancy, colorful UI. So it's like, this is not a mobile device, but it's in there. That's crazy. I think one big thing is making what's labeled as making it feel familiar. A big effort is like, is it native? A lot of people are developing cross-platform applications that look the same on iOS versus Android. So how are you all working to reduce that friction for developers? And can you talk about the decision to integrate Expo within, I assume, Horizon OS in general?

Evan Albert:

Yeah, I think that's probably, in my opinion, the coolest actual developer experience at the moment. So because Expo actually runs on Horizon OS, on a Meta Quest headset, you can actually get to the point where with remote desktop, with your IDE, you can be developing a React Native app running inside the headset all through the headset. So you've got your IDE open, you've got your app open, you've got hot reload working. And honestly, it's probably the most seamless kind of developer experience we have at the moment for developing on the headset. So everything that you're used to — creating an Expo app to just running on Android — is going to work on the headset as well because essentially the Meta Quest is just going to come up as an Android device. So the same way that you can pick a simulator or your mobile phone, your VR headset is right there next to it.

Mazen Chami:

Why was it important for you all to make sure this feels identical to the process one would use on a device or a TV, per se?

Evan Albert:

Yeah. So I think for us, because of the fact that developers just naturally are very used to their tools, right?

Robin Heinze:

Yeah. We do not like change.

Evan Albert:

Exactly. Creatures of habit.

Robin Heinze:

Yeah.

Evan Albert:

Creatures of habit I think is a great way to put it. And we really wanted to make this as seamless as possible for developers. We want this to be a target and just an opportunity, something that's low lift, and you can reach a large amount of users on this new wide-open platform.

Mazen Chami:

So can you walk me through a process as a React Native developer with Expo in mind, how I would configure my project to then build an app for Horizon OS? Pick any random app, whether it's a to-do app or something.

Evan Albert:

Yeah. So we actually partnered with Software Mansion to build out a couple Expo Horizon OS specific libraries. So kind of the easiest way to get started is there's an Expo Horizon Core, I believe the library is called. And you can kind of walk through the same way you create an Expo project, integrate this library, and that actually handles a lot of the configuration that is recommended for developing on Quest. So a lot of this stuff, if you think about it, an Android app usually is on a phone, which is a very particular orientation — portrait. This will get you set up to be landscape because in the headset, you actually, you've got a lot more screen real estate. It just changes.

Robin Heinze:

Yeah. It's not a square.

Evan Albert:

Yeah. Exactly. And that's probably the fastest path to getting up and going. Start your dev server, run it on the headset. And again, everything is right there for you, hot reload's working, and that'll configure all of the different build flavors. So you can be targeting both mobile and Quest all from the same codebase.

Robin Heinze:

Okay. So it sounds like the Expo Horizon Core plugin, I think is what it's called, is making it a much more sort of plug-and-play experience, automating a lot of the configuration.

Mazen Chami:

I mean, one, looking at the docs, one thing it does is ExpoHorizon.isHorizonDevice, and then you put in your specific UI or feature. So that to me sounds very similar to our Platform.OS — a quick Platform.OS triple equals iOS or Android is Android device. And like you said, it looks similar. So creatures of habit gets you using the same tooling and same form to build the same thing. So that's pretty cool.

Robin Heinze:

So obviously your goal is to make it as similar as possible, but what feels different? So if you're sitting down as a React Native developer to make your first Quest app, what feels the same, but also what feels super different? What's that experience going to be like for a first timer?

Evan Albert:

So I think the two big differences are — I would say I would bucket it into design and then we can talk about the GMS difference. So starting with design, kind of what we talked about earlier, it's different in the sense that panels or windows in Horizon OS are resizable. For most cases, an Android app is going to be a static screen size, either a phone or a tablet. You can target desktops where resizability is a thing, but I think that's probably the biggest kind of design change. As far as input goes, it's actually very, very similar. I think the big difference there is going to be hover effects. There's no hover effects on the phone. You tap, you do the thing. And with the headset and VR, we actually use raycasting off of your hands. So you can actually hover over something and then it's pinch to click.

Robin Heinze:

It feels like a weird hybrid between mobile and web in a lot of ways.

Evan Albert:

Exactly.

Robin Heinze:

You're working with essentially a pointer and you have this big canvas, a bit like a bigger canvas like you would in a browser, but you're also working with gestures and other sort of complex input. So yeah, it's an interesting hybrid between the two.

Evan Albert:

Yeah. And the thing to call out there is actually the raycasting and pinch to click is all something that just works out of the box. That's kind of handled by the system for you. So there's no specific input controls that you need to build into your Android app or React Native app for this thing to work. Just that big difference is if you are building a React Native app that has an adaptive layout, it should all just actually work nicely if you are targeting mobile, desktop, and web.

Robin Heinze:

So are you still going to be using your familiar input components and onPress? How do those sorts of interactive components look different when you're actually building your components?

Evan Albert:

So all of those are going to be exactly the same. So let's take buttons and things. I believe a lot of the components are already going to have hover effects and things, which you'll start seeing on the headset the same way you would on desktop with a pointer input. And things like text, same thing. There is a keyboard, a system-level keyboard the same way there is on a phone. So all of that stuff really just works out of the box.

Mazen Chami:

That's amazing. Pretty much like full API parity between the current — what's on reactnative.dev docs — to mapping over. So this is purely just an extension, right? It's just another OS that you're developing for. That's awesome. Yeah. Don't overcomplicate it when it doesn't need to be, I guess. I mean, I think there's more to it. Of course, the technology on the headset to do the translation, make this happen. Yes, I'm not minimizing that, but it's just from our perspective, it's just pretty cool that we just now get another platform.

Evan Albert:

Yeah. We work with a lot of third-party developers directly, and I think that's the feedback that we hear the most often. It just works. You're targeting another platform and everything feels very, very seamless.

Robin Heinze:

I mean, what sort of opportunities does this create? All of these sort of extra features that you wouldn't normally get on a device, like your infinite screen size. I think multitasking is an option. What sort of opportunities does this unlock for a React Native developer that they wouldn't ordinarily get to experience?

Evan Albert:

So obviously screen size is the big one. I think one of the earliest sells of VR was this kind of really big screen entertainment type thing. So I think that's a big one. I think the multitasking in particular is super interesting. We've seen some different use cases around, "Hey, there's a game that I like to play on my headset and people are building out apps that are guides that can just live along right alongside these things." Where on a phone, you'd be kind of swiping back and forth between the game and your whatever guide you're looking at — with this, all of this is in one place and you can kind of multitask between those things. I think the other really interesting use case that we've seen pop up recently too is multi-panel apps. So one thing that the Quest lets you do is actually have a multi-panel, multi-window app.

So if you think about — someone built a stock picker actually, like a stock tracker. So you could have kind of charts over here, you can have notes over here, and these are actually two separate panels that you can move around in your space and be tracking multiple stocks over time and things like that. So there's a lot of possibility. I think we're just kind of scratching the surface in terms of seeing what that developer creativity is.

Robin Heinze:

Well, yeah, it's going to take people sort of rethinking about what kinds of things you can build. When you were talking about the stock picker and customizing things in space around you, I immediately went to sports. So I'm a huge Formula One nerd and I can totally see watching the race. And then I have my driver tracker over here and I've got the tire stats on, and I'm kind of arranging my experience so it's much more immersive. I can already see a ton of cool things that you could do with this sort of 3D world. That's super exciting. Mazen, what app would you build?

Mazen Chami:

I would build a soccer app. So you're actually on the field running around kicking a ball.

Robin Heinze:

Yeah.

Mazen Chami:

Well, no, I don't even know how I would do that, but more of like an interactive — so there's an app that I use, I open at least a couple times a day called Livescore, which is every current score of pretty much every league in the world. And I just watch it for daily updates. And it also does other sports too. It's not just soccer. I believe it has basketball, tennis, cricket, and stuff like that. But that would probably be one that I'd build just to be more animated because this is just a list of scores. You click it and you see the scores, subs, and all that. But if there's a goal, show some confetti on the screen, give that — because I feel for me, when it comes to VR or even AR at the same time, you expect something interactive, not just the list.

You want something that's very interactive. So some way of integrating animations, I think would be something that I would do, which actually I wanted to ask. So you recently released the Meta Spatial Simulator. Can you explain what it is and why it's a game changer? And I know I said I wouldn't build a soccer app, but this would probably be my intro to it.

Evan Albert:

Yeah. So one piece of feedback which we hear quite often is developing on the headset specifically can be, let's say, frustrating at times. If you think about the experience around — I'm working on my laptop, I'm in the IDE, and I'm having to take the headset on and off and on and off as I'm trying to iterate on even just some basic UI. So that was kind of the starting point of, hey, we need to build something that is more of a desktop simulator similar to kind of Android virtual devices, but that more closely resembles developing for Horizon OS specifically. So I believe we launched earlier this year, so you can find it. It actually lives inside our Android Studio plugin called the Meta Horizon plugin. From there, you can actually download the Spatial Simulator. And from a kind of UI perspective, it'll more faithfully represent what your app's going to look like in a Meta Quest headset. And then there's actually some other nice things built in there in kind of the system OS side. So we have our own version of kind of GMS, which we call Platform Services, and there's a Platform SDK. So if you think about things like billing, there's some leaderboard support and things, and that is all stuff that you could actually test against mock data in the simulator as well. So if you are building out those integrations, it's a lot easier than getting into headset, using real data, and you can do it all kind of from the desktop.

Robin Heinze:

Yeah. I mean, that makes a ton of sense because I mean, yeah, we'll test for iOS and Android, we'll test everything on devices at some point, but most of our fast iterative development is going to be on a simulator just because it's nearer to where we're writing the code, right?

Evan Albert:

Exactly.

Robin Heinze:

Unless you have plans to put VS Code in the Meta Quest — you just wear the headset all day.

Evan Albert:

Well, and that's actually been the cool thing with Expo, right? Because we have remote desktop, which is actually something that Meta builds, you can bring VS Code with you. I believe Surface Keyboard is also kind of rolled out widely on the Quest. So you've got your keyboard, you got your trackpad, you've got your IDE with you.

Robin Heinze:

Surface keyboard, what's that?

Evan Albert:

So if you imagine you're at your desk, you don't have a keyboard with you, it'll actually project a keyboard on your desk and you can type as you would on a physical keyboard.

Mazen Chami:

Like a hologram keyboard on your desk that you just tap onto. Interesting. So actually I want to ask a question, follow up on that. So I know we said develop on the simulator essentially and then eventually do on the physical. I know when it comes to specific features, like push notifications, always best to do on a physical device when it comes to testing. You don't want to do it on a simulator. You can test OS-level permissions, turning them on and off, what happens — that works just as fine. Is there also a disparity in this scenario too where we still want to make sure we're always testing on the hardware because there's going to be gaps?

Evan Albert:

Yeah. So obviously our goal with the simulator is let's make this thing as close as possible. Ideally, a developer can get to 90-ish percent of the way there without ever putting on a headset. It's also a good opportunity for us to attract developers who don't have headsets. We want them to be able to get that 90% of the way there. We also do recommend before you actually publish anything, you should actually test it on the device. Of course. I think the big differences there are going to be like the Platform Services that I mentioned and all the user data — all of that only lives in the headset. All of that in the simulator is mocked out. And then I think the other bit that is different between the headset and the simulator is this multitasking experience. The simulator right now is a single 2D app similar to an Android virtual device.

And I think there is value in really testing what that multitasking experience feels like, how this app also lives alongside other things in Horizon OS, like the browser, for example. And then I think the last bit that's not quite at parity is performance, right? Graphics and performance. Headset's going to be different hardware specs than if you're running on a Mac or Windows. So taking a look there to see how animations play out and things like that is always something that we recommend.

Mazen Chami:

Okay. So this is going back to the same thing you would do when doing iOS and Android. I would still want to validate my animations on a physical device because like you said, running on any M chip, even if it's the M1, your simulator, your animations aren't going to be choppy, right? They're going to be smooth. So always test on that physical device.

Robin Heinze:

So it's not a replacement for having a Meta Quest to test things, but it does streamline the daily development experience, especially if you're like me and you get motion sick while wearing the headset.

Mazen Chami:

Spoiler here. No offense to anybody that develops this stuff. I will not put on an AR or VR headset. I can't do it.

Robin Heinze:

You have trouble just riding in the backseat.

Mazen Chami:

I do not ride in the backseat. I'm fine. It just feels weird. I'm usually driving. I don't like sitting in a car in the other seat, but that's fine. That's a different story. I can't do roller coasters either, which my son is big into now all of a sudden. So it's turning into a wild ride these days.

Robin Heinze:

That's actually a good question just randomly. Do you have any advice or tips? Does Meta give out advice for people who get motion sick wearing the Meta Quest to avoid that or get over it?

Mazen Chami:

Dramamine?

Evan Albert:

That's a great question. So I mean, honestly, transparently, I was kind of that way to begin with. I think it's just like an acclimation thing.

Robin Heinze:

Yeah, you acclimate over time.

Evan Albert:

Yeah. Obviously, I have to use it for work for a pretty long time.

Robin Heinze:

Yeah. Yeah. So you've had time to acclimate.

Evan Albert:

Yeah. And I think it actually does get better over time. Start in short stints and kind of see how it goes.

Robin Heinze:

Good. Good advice.

Mazen Chami:

Yeah. Not sure. Yeah. We'll see.

Robin Heinze:

We'll see if Mazen does.

Mazen Chami:

I'll dip the toe in maybe one day. Well, okay, cool. I think we're kind of getting closer towards the end of time here. So I want to shift our conversation to looking ahead. So now that this is rolled out, people are developing, you're seeing, you're getting a lot of feedback, you're iterating on it. Where do you see React Native on the Quest heading in the near future?

Evan Albert:

So I think this is actually more broad to just the Quest, but we are seeing a general trend towards VR and AR devices. We see that obviously the Quest is kind of the leader in the space. There's other people coming along — Android XR, Apple Vision Pro — but Meta has the most devices in the market currently. And generally I see there's a shift here in terms of when VR started, it was very much built around gaming. That was kind of the first big use case. And I think that the big shift is coming in terms of seeing these headsets as more kind of general purpose computing devices where it's not necessarily all about immersive games and VR gaming. These are real kind of productivity tools that people use. And I think React Native, frankly, fits that category really well. If you think about, yeah, like we talked about, these people are used to building cross-platform and a lot of these apps are kind of utility, productivity focused. Games are obviously a part of that as well, but I think there's a big opportunity for React Native developers to come and really be kind of the first big cohort of developers building for the Quest headsets.

Mazen Chami:

So on that note, what capabilities or improvements do you know that you all are working on down the pipeline that you're excited about?

Evan Albert:

So I can't talk too much about future plans and devices and so on.

Robin Heinze:

We had to try.

Evan Albert:

I can say that we're definitely working on a ton of exciting stuff. I think actually something we released, I believe last week, that we announced at GDC — it's a CLI and a kind of MCP tool called HCDB, Horizon Debug Bridge, kind of ADB-ish.

Robin Heinze:

ADB. Yeah.

Evan Albert:

And I think that's actually going to open up another kind of big swath of developers. In today's world, a lot of people are using AI in different ways to help write code and build apps and create experiences. And HCDB is kind of our first release into really targeting and supporting that development path. So I think kind of the AI-assisted flow with also how good those models are with React Native to start with, right? There's so much training data in that space already. We're seeing PMs and designers across the company building really cool stuff for the headset without really any background in computer science or engineering or anything like that.

So I think that to me is, it's a really interesting kind of new world and opportunity for not just React Native developers, but people to develop with React Native coming in fresh and coming in as someone new to the space.

Robin Heinze:

On that note, our listeners, keep an eye out. We'll probably be having an episode in the next couple months talking about exactly that and the shift towards AI and React Native. So keep an eye out.

Mazen Chami:

Is there something going on with AI these days?

Robin Heinze:

Where have you been, Mazen? Yeah, yeah. I would say there's some stuff going on, but yeah.

Mazen Chami:

Awesome. So Evan, thank you for that. And I think one thing I'd like to do is ask you, as a React Native developer, if I'm looking to get into Meta Quest and build an app, what advice do you have for me to get in and also, where should I start?

Evan Albert:

So I definitely think right now the Expo path is probably the cleanest and nicest just to get going quickly and start building. We obviously have all of our developer documentation, which will walk you through — for the most part it's design guidelines. I think that's kind of the big mental shift from building for a phone or a tablet to building for VR. But again, all of this stuff should feel very familiar. So pick your favorite IDE, get going on Expo. Expo Core Horizon plugin is a great starting point. And from there, just build. I think starting from this 2D world that feels really familiar is a great starting point. Things will just work as you would for the most part expect, and then kind of exploring — how do I differentiate in a VR world, right? Now that I have this infinite screen space, this ability to multitask, a 3D environment, what kind of cool things and creative things can I think of?

And I think that's the natural progression that we've seen developers take and really be successful with.

Mazen Chami:

That's awesome. I mean, think of the continuity here. Using an iOS device, you shift to your Apple TV, and then you put on your Meta Quest and you walk away and you continue on that same app. All look, same feel, everything's the same — same user account, same data. That's pretty cool. That's a pretty cool future or present, I guess, that we're in right now. That's awesome. Well, that's all we have for this episode. Evan, thank you so much for coming on. I really appreciate it. Before we sign off, Robin, do you have a mom joke for us?

Robin Heinze:

I have a St. Patrick's Day joke. Is that what we're going for?

Mazen Chami:

Yeah, I'm wearing a green shirt, so that should be good.

Robin Heinze:

How come you should never borrow money from a leprechaun? Because they're always a little short.

Mazen Chami:

That's a good one. Awesome. Well, thank you all again, and to our listeners, we'll see you all next time.

Jed Bartausky:

As always, thanks to our editors, Todd Werth, Tyler Williams, and Jed Bartausky, our marketing and episode release coordinator, Justin Huskey, and our guest coordinator, Mazen Chami. Our producers and hosts are Jamon Holmgren, Robin Heinze, and Mazen Chami. Thanks to our sponsor, Infinite Red. Check us out at infinite.red/radio. A special thanks to all of you listening today. Make sure to subscribe to React Native Radio on all the major podcasting platforms.