Facebook's 'React Native' Has Changed the Rules of App Development With this new cross-platform app, you can spend more time meeting users' needs and less time worrying about your choice of smartphone.
By Rudy Mutter Edited by Dan Bova
Opinions expressed by Entrepreneur contributors are their own.
Which would you choose: a single-platform app with a great user experience or a cross-platform app with a poor one?
Entrepreneurs would be facing that choice had Facebook not agreed in September to relicense its popular React framework for third parties. React Native renders mobile user interfaces on both iOS and Android with minimal or even no native coding required.
Related: User Experience Is Integral to Winning App Design
It wouldn't have been an easy decision to make. A tailored user experience is more important to customers than ever, yet six-figure app development costs offer a powerful incentive to inexpensively support both platforms.
With React Native, however, entrepreneurs can have the best of both worlds. Whether you're building a new app or improving an old one, use the following four tips to complete that task with React Native, which:
1. Supports both platforms from the start
In the past, determining which platform to support was a question of the app's likely user base. North America and Western Europe are dominated by iOS, while Android leads almost everywhere else. Globally, 88 percent of smartphone users run Android.
Related: Sorry Windows, Android Is the World's Most Popular OS
React Native almost entirely eliminates this choice. Rather than construct parallel codebases in Swift and Java (the respective languages of iOS and Android), developers using React Native need only to maintain a single JavaScript codebase for both platforms.
At Yeti, we tried cross-platform solutions such as PhoneGap and Xamarin, but neither offered a great experience for users and developers alike. That isn't to say that React Native eliminates all cross-platform challenges, but it substantially reduces them.
2. Identifies platform-specific needs for native code.
What of the remaining cross-platform challenges? They tend to come down to hardware differences between the two devices. For example, if your app will use Bluetooth technology, Apple Pay or Android's near-field communication feature, you'll still need to write native code.
So, conduct rigorous testing to ensure that any features you build in React Native work across Android devices' varying shapes and screen sizes. Consider designing and developing screens separately if they don't render cleanly in Android or iOS.
And know the good news: that native-code needs have been steadily decreasing as the React community has matured.
Need help? Check React Native component libraries to avoid reinventing the wheel with native iOS or Android code.
3. Plan ahead with web apps.
"Mobile first" has become the mantra of entrepreneurs and developers. The reason is that porting from web to mobile can be a nightmare. What works on desktop rarely works on a smartphone screen.
React Native doesn't solve many desktop-to-mobile design challenges, but it does enable entrepreneurs to reuse code from web apps written in React. There's a talent advantage there, too: Web developers using React Native can more easily cross into mobile development than they'd otherwise be able to.
Walmart Labs, actually, has just made this process even easier. The company, which uses a React-based system for the front end of its website, just open-sourced a tool that allows entrepreneurs to migrate existing apps to React Native. Walmart used its own tool to convert its shopping cart web app to its mobile app.
4. Don't sweat porting between mobile platforms.
Even if their interfaces look similar, an iOS app and its Android brother run on vastly different code. Until React Native, making an app fluent in both languages was no small task. Just one challenge, for example, is that Apple design elements exist within two dimensions, whereas Android design incorporates depth.
But assuming that the app doesn't make extensive use of proprietary hardware, such as the phone's camera, React Native can drastically cut conversion times. A relatively simple React Native app initially deployed for iOS can be rolled out for Android in mere weeks. Just be sure to check for interface issues and incorporate proprietary features, such as Android's back button, before going to market.
Related: Early Days, But Apple Pay Struggles Outside U.S.
Facebook itself did this in 2015. The tech giant made its Ads Manager app, originally developed for iOS, both its first React Native app and its first fully cross-platform app. Porting Ads Manager to Android took three months, but the team has since turned React Native conversions into a science.
In sum, those outside the tech world may underestimate the impact React Native is having on app development. And supporting both iOS and Android is nowhere near the enormous undertaking it once was. With React Native, entrepreneurs can spend more time meeting users' needs and less time worrying about their choice of smartphone.
