Are you planning to create a react-native app? You’ll probably get a lot of inquiries like, “Should I use boilerplate?” What exactly is a boilerplate? Is it better to use Expo or not?
Let me start by saying that I am absolutely new to this tech stack. I have been developing apps in Dart for a long time and decided to branch out because JavaScript is getting increasingly popular.
React Native:
React Native (also known as RN) is a popular JavaScript-based mobile app framework created by Facebook that allows you to build natively rendered mobile apps for iOS and Android. The framework lets you create an application for various platforms by using the same codebase.
Boilerplates:
Boilerplates are a type of template that makes building an app from scratch easier. I looked into boilerplates further and learned about a handful of them. You can have a look at some popular boilerplates here and determine whether or not to employ them.
Ignite by Infinite Red is the most popular one, it has over 12k stars on Github. Let’s dive deep into it. It is a cutting edge react native project boilerplate, that includes a CLI, component/model generators and many more.
This Typescript-ready project uses MobX for state management, React-navigation for routing and navigation, Apisauce for talking with REST servers, and the Jest framework for testing.
If you are a complete beginner, then I would suggest you go through this.
There are basically two methods to create the react-native application:
1.Expo
2.React-native CLI
We will go through both of them one by one
Expo
Expo is a framework that is used to build React Native apps. It is basically a bundle with tools and services built for React Native, that will help you get started with building React Native apps with ease.
Advantages:
- Setting up a project is easy and can be done in minutes
- Anyone can open the project while you’re working on it
- Sharing the app is easy (via QR-code or link), you don’t have to send the whole .apk or .ipa file
- No build necessary to run the app
- Integrates some basic libraries in a standard project (Push Notifications, Asset Manager, etc.)
- You can eject it to ExpoKit and integrate native code continuing using some of the Expo features, but not all of them
- Expo can build .apk and .ipa files (distribution to stores possible with Expo)
- And the most important one, at least for me, You don’t have to own a Macbook for developing iOS applications
Disadvantages:
- You can’t add native modules (probably a game-changer for some)
- You can’t use libraries that use native code in Objective-C/Java
- The standard Hello World app is about 25MB big (because of the integrated libraries)
- If you want to use: FaceDetector, ARKit, or Payments you need to eject it to ExpoKit
- Ejecting it to ExpoKit has a trade-off of features of Expo, e.g. you cannot share via QR code
- When ejecting to ExpoKit you are limited to the react-native version that is supported by ExpoKit then
- Debugging in ExpoKit (with native modules) is a lot more complicated since it mixes two languages and different libraries (no official Expo support anymore)
React-native CLI:
It generates a plain react-native project for you with separate native projects for iOS and Android platforms. You just have to type the “react-native init” command.
Advantages:
- You can add native modules written in Java/Objective-C (probably the only but the strongest one)
Disadvantages:
- Needs Android Studio and XCode to run the projects
- You can’t develop for iOS without having a mac
- The device has to be connected via USB to use for testing
- Fonts need to be imported manually in XCode
- If you want to share the app you need to send the whole .apk / .ipa file
- Does not provide JS APIs out of the box, e.g. Push-Notifications, Asset Manager, they need to be manually installed and linked with npm for example
- Setting up a working project properly (including device configuration) is rather complicated and can take time
This is all that you need to know before switching to react-native. I struggled a lot in these things, so thought to share.
If you enjoyed this article, please give it a thumbs up :)
Top comments (0)