React Native and the New Dream of Learn Once, Write Anywhere – InApps 2025

Created by Facebook and currently utilized by companies such as Netflix, Airbnb, Dropbox, as well as many others, the React JavaScript framework offers a fresh approach to creating user interfaces and is one of the hottest new web front end technologies. Now, with React Native — now available for iOs and Android — curious mobile developers can begin learning what makes React so special. Additionally, React Native can be used by seasoned web devs looking to spin up a quick mobile app, now have another handy tool to enable them to do so, whilst being to carry over a majority of their current skill set.

The Dream of Write Once Run Anywhere

From Java to C# Xamerian, the ability to write a single code base that works across multiple platforms has been the holy grail of mobile development. Additionally, many developers have far more experience with web development toolchains, than they do with mobile development ones, and are reluctant to expand a large amount of time and effort learning “yet another framework.”

But many are finding the “write-once, run-anywhere” paradigm is closer to “right-once, debug-everywhere” at best, and at worst being able only to carry over only a tiny bit of app logic and code over from system to system.

The other major limitation with some incumbent solutions is a lack of proper access to low-level hardware APIs — such as GPS, tilting, and multi-touch features. Finally, many of the current cross-platform mobile frameworks suffer from substantial performance penalties.

Even in the best case scenario, your average web developer is going to experience a substantial amount of friction switching to mobile development, and will often end up developing a subpar mobile application.

Redefining the Dream

While any developer would love it if their code just ran anywhere, this is a difficult problem to solve. It is somewhat of a workaround solution to the actual underlying issue: Most developers want to be able to carry over their skill sets from environment to environment, and don’t want to learn everything from scratch, just to target another platform.

While still a difficult problem — and perhaps not as ideal as simply having one code base run anywhere — this is a tractable problem to solve. With React Native, the new paradigm is “learn once, write anywhere.” With this approach, an experienced web React developer can get up and running, and write Android or iOS apps at a much faster pace.

Currently, there is a little to no code sharing possible between React apps on the web, Android, and iOS React apps. With time, Facebook hopes to allow code sharing between target platforms. To understand how this will be facilitated, we can look at how React for web was broken into two packages: React and React DOM.

Not About the DOM

At its core, React was never about the Document Object Model (DOM), the standard HTML API for browsers to interpret web pages; the DOM was just an implementation detail to how React was created for the web.

When programming in React, one ideally doesn’t do any work with the actual underlying DOM; instead, one stays within React’s virtual-dom and let’s it figure out how that translates to the real DOM.

For those who aren’t familiar with React’s virtual-dom, the virtual-dom is a lightweight abstract description of a DOM. The actual DOM is quite heavy weight and a resource hog while React’s virtual-dom is composed of lightweight JavaScript objects. Instead of going straight to the DOM, each change in your applications DOM generates a new virtual-dom and is compared with the previous iteration. This difference is then applied to the actual DOM.

This approach is efficient as React does the minimum amount of actual DOM manipulation necessary to bring us to this new state, even if conceptually we can view it as we are just regenerating the entire DOM with each change to our application. This allows developers to reason easily about application state and in an immutable way, while getting all the performance benefits of making small changes to a mutable document structure.

But What About iOS and Android?

Given that, how does this relate to the bigger picture of React not being about the DOM? Well, imagine instead of the DOM, we are composing an app made up of iOS components, or even more abstractly, any set of UI widgets for a platform. We can still describe the app as a series of nested components, where we will define our “pseudo” components, that eventually resolve to actual UI widgets or DOM elements. For example, let’s say we had a fairly typical app with navigation. The official React Native site provides an iOs code sample for this:

And the “equivalent” Android version:

While these apps have different underlying components, Android having DrawerLayout and iOs have TabBarIos, the general structure of both apps look quite similar, even to a developer that isn’t familiar with React or mobile development! This is a major win as it not only allows developers to leverage roughly the same skill set for both apps, but it makes porting from one platform to another a much simpler affair. Instead of having to possibly — and quite likely — re-architect the app from scratch, the porting process will mostly entail swapping out one version of a component with another. The overall component hierarchy design will largely remain the same, though.

Companies left and right have been adopting React Native for their applications. It remains to be seen if React Native is a passing trend or the cross-platform solution many of us have been waiting for, but React Native is off to a great start so far!

Feature Image via Pixabay, licensed under cc0.