Design vector created by stories — www.freepik.com

Setting Up React Native with RN CLI

There are two different ways of starting a React Native app, by the Expo CLI or by the React Native CLI.

While the expo it’s relatively easier to use and can easily be “transferred” to the React Native CLI, it can offer some limitations when building your app, so it might be on your best interest to start with the more tricky setup and do not have to worry about it in the long term.

Also, be aware, this a Mac OS set up, if you are a Windows or a Linux user, things might be a little bit different for you, but you won’t be able to test your app on an iPhone emulator as it’s not supported.

Installing

Before you start, make sure you have these installed in your system:

• Android Studio
• Xcode
• Node and Watchman, you can install it with Homebrew

First check if homebrew is installed on your Mac:

brew --version

if not, access here for more info, and the type this on your terminal:

brew install node 
brew install watchman

• React Native command-line interface
• and CocoaPods, which manages library dependencies for your Xcode projects.

The dependencies for your projects are specified in a single text file called a Podfile. CocoaPods will resolve dependencies between libraries, fetch the resulting source code, then link it together in an Xcode workspace to build your project.

sudo gem install cocoapods

CocoaPods is built in Ruby, so that’s why you use a gem to install it.

Setting Up

Android Studio

Open the app, on the bottom right, go to configure > SDK Manager

And make sure you have the latest stable Android version installed.

And now you need to create an emulator, go again to Configure > AVD Manager (Android Virtual Devices Manager, and if you don’t have a virtual machine, you will need to create one.

Chose a model, it automatically chooses Pixel 2, and the system image, the most stable version at the time I was writing this it was Q, but it’s totally fine to use R.

Don’t forget to launch your emulator before you try to launch your app.

Java

After doing all this, I was having an issue where my computer was complaining that Java wasn’t installed.

Clicking on More Info… will take you to the Oracle website, and install the “macOS installer”, then, if you try to run “java -version” it should return something like this:

Starting A Project

Now everything should be where it is, to start a React Native app you can use npx:

npx react-native init AwesomeProject

and then:

cd AwsomeProject
cd ios
pod install

and there it is, your app is up and to run the type on the project main folder to open it o the iPhone machine:

npx react-native run-ios

or this for android:

npx react-native run-android

If you have any questions or anything else to add, feel free leave a comment or to contact me directly on Twitter.