FAQs

What is React Native?

A core set of mobile platform-agnostic native components, written in JavaScript, that map directly to the target platform’s native UI building blocks


Intro

The React Native framework was released to the public in March of 2015. It started out as React Native for iOS and toward the end of that year, React Native for Android was added.

Some may also remember Facebook’s Ads Manager was introduced in February of that same year. First for iOS and then for Android. According to Facebook, Ads Manager, born out of a close collaboration between the Ads Manager product team and React Native team, was the first cross-platform React Native app.

Getting Started with React Native

Essentially, React Native provides a core set of mobile platform-agnostic native components that map directly to the target platform’s native UI building blocks. One of the appeals of React Native is that it is built on an already popular open-source Javascript library for building user interfaces simply called React. That means, for the most part, you can use many of the same developer tools you were using to build your React components.

For example, assuming you have Node JS and a package manager like npm, you can scaffold a React Native app with the following command:

$ npx react-native init MyReactNativeApp

Once the scaffold is complete, you’ll be able to open the app directory and see Android and iOS folders where the app can be configured for those two platforms. This is relevant for scenarios like if you wanted to potentially improve performance by enabling the Hermes engine for either platform.

React Native’s Primary Draw

Perhaps the primary draw of React Native is that it allows for cross-platform app development. That essentially means instead of developing an app per platform, you are able to reuse the code to deploy the same app to multiple platforms with minimal changes. In this case, the same JavaScript code deployed as a web application can also be deployed to the iOS and Android mobile platforms and have the user experiences closely resemble an app that was written in Objective C and using the Android SDK respectively. If there is the need to do some platform-specific development, you have the option of developing a native module assuming you have knowledge of that specific native platform.

React Native and Expo

If you’re sincerely interested in getting started with React Native, I would create a free Expo account and use its CLI to scaffold a new project. Expo’s maturity comes at a great time since Facebook’s official support for the React Native SDK ended on January 19th. This will allow you to bypass some of the initial time-consuming setup requirements like installing Android Studio.  I should also mention it is very difficult to develop iOS apps on a Windows laptop, so if you fit this category, I would definitely give Expo a try. 

Once you create your account, your initial setup instructions should look something like this:

$ npm i -g expo-cli $ expo init new-project-name
Code language: JavaScript (javascript)

The expo init wizard will give you the option of what you want your initial setup to look like. Once the setup is complete, you may notice there are no android or ios configuration directories this time. 

You may also notice there are no unit tests. You’ll need the following two libraries for that:

$ yarn add jest-expo --dev $ yarn add react-test-renderer --dev

You can then make the following adjustments to your package.json, and you should be ready to go:

package.json

... "scripts": { ... "test": "jest" }, "jest": { "preset": "jest-expo" } ...
Code language: JavaScript (javascript)

The React Native Ecosystem

Whenever you’re evaluating an app development framework, you have to acknowledge it doesn’t exist in a vacuum. While Expo was built with React Native in mind, It’s good to know how well React Native integrates with other tools & technologies that have a broader focus. For example, you may want to send data the application creates to an analytics tool. Fortunately, React Native has fairly snug integrations with analytics tools like Segment and Heap.

There’s much more we can and hopefully will share about React Native. For example, the React Native integrations alone could fill several technical articles. There are attractive frameworks out there like Flutter, but until frameworks like these mature, React Native will remain a solid option for cross-platform app development.   



References

Budziński, Muciej. “What is React Native and How is it Used?” https://www.netguru.com/what-is-react-native. Accessed 3/29/2021.

Peal, Gabriel. “React Native at Airbnb: The Technology.” https://medium.com/airbnb-engineering/react-native-at-airbnb-the-technology-dafd0b43838. Accessed 3/29/2021.

Witte, Daniel and Weitershausen, Philipp von. https://engineering.fb.com/2015/09/14/developer-tools/react-native-for-android-how-we-built-the-first-cross-platform-react-native-app/. “React Native for Android: How we built the first cross-platform React Native app.”

“React Native – learn once, write anywhere.” https://reactnative.dev/. Accessed 3/29/2021.

“Github – facebook: A framework for building native apps.” https://github.com/facebook/react-native. Accessed 3/29/2021.

Grabowski, Mike. “Announcing React Native 0.64 with Hermes on iOS.” https://reactnative.dev/blog/2021/03/12/version-0.64?utm_source=SocialAnimal&utm_medium=referral. Accessed 3/29/2021.

Ancheta, Wern. “Getting Started with React Native.” https://www.sitepoint.com/getting-started-with-react-native/. Accessed 3/29/2021.

React Native SDK. https://developers.facebook.com/docs/react-native/. Accessed 4/8/2021.

Share.

Comments are closed.