News

Facebook Releases React Native for Building Android Apps in JavaScript

• By David Ramel
• September 14, 2015

React Native for Android, promised in March as "coming soon," was announced today by Facebook.

Based on the popular React JavaScript technology, Facebook earlier brought its new-age approach to bear on iOS apps in late March, telling Android developers to wait six months for the follow-on product for targeting Google's mobile OS. The Facebook team did it with a couple weeks to spare.

"React Native brings what developers are used to from React on the Web -- declarative self-contained UI components and fast development cycles -- to the mobile platform, while retaining the speed, fidelity and feel of native applications," said Facebook engineers Daniel Witte and Philipp von Weitershausen in a blog post today. "Today, we're happy to release React Native for Android."

React JavaScript allows for the mixing of logic and presentation -- long considered a no-no in modern development. React is based on components -- units of code that act somewhat like classes -- that take in data and produce HTML (in the case of the Web application), or native views and other elements, based on that data. Individual components can provide certain specific functionality and be chained together for projects, encouraging reuse and simplifying the reasoning of program logic.

React Native for Android is here! Use React to build truly native apps on multiple platforms: https://t.co/otNv8zWyzC

— Jordan (@jordwalke) September 14, 2015

In bringing the technology to the native mobile space, Facebook engineer Tom Occhino said the company eschewed the typical cross-platform approach wherein one code base can be used to target multiple platforms.

"We're not chasing the write-once, run-anywhere pipe dream," Occhino said. "Instead, what we want to do is chase the learn-once, write-anywhere paradigm." The idea is to be conversant in React so a team can write an iOS app one day and turn around and write the very same app for Android the next day, and both will be truly native apps, but written in JavaScript -- or rather React Native.

"The focus of React Native is on developer efficiency across all the platforms you care about -- learn once, write anywhere," the project's GitHub page reiterates. "Facebook uses React Native in multiple production apps and will continue investing in React Native."

In today's blog post, Witte and von Weitershausen described how they built the first cross-platform React Native app, called Ads Manager.

Guided by experienced iOS engineers, the team grew to eight developers who cranked out the app for the Apple platform, leveraging pre-existing JavaScript libraries such as GraphQL and Relay.

The duo detailed several complicated obstacles they encountered and how they were overcome, sharing lessons learned.

"One lesson we learned was that working across separate iOS and Android code repositories is difficult, even with lots of tools and automation," they said. "When we were building the app, Facebook used this model, and all of our build automation and developer processes were set up around it. However, it doesn't work well for a product that, for the most part, has a single shared JavaScript codebase. Fortunately, Facebook is moving to a unified repository for both platforms -- only one copy of common JavaScript code will be necessary, and syncs will be a thing of the past.

The Facebook coders also emphasized the importance of testing on both platforms, which they said was fraught with human error. But testing-related obstacles were also overcome, with testing pitfall risks outweighed by development efficiency afforded by the React approach.

"When all was said and done, our bet paid off," they said. "We were able to ship Facebook's first fully React Native app on two platforms, with native look and feel, built by the same team of JavaScript engineers."

That goal can now be pursued by the developer community at large, which can get started here.

"I'm extremely excited about the possibility of developing future functionality for our Android app using React Native," said one developer on a Hacker News post. "It's not about the language (I find using dynamically typed languages for large systems frustrating, despite how expressive they can be) or even the iOS/Web reusability for me -- it's the fact that the React way of seeing the world just makes so much sense. Describing views as a (pure, as long as you're careful) function of state feels so clean to me."