React Native Up In <5 Minutes

Ok, let’s hop right in.

Note: I’ll be using yarn throughout the tutorial.

Install the Expo CLI command line utility:

yarn global add expo-cli

Now let’s create the React project and call it “rn-project”:

expo init rn-project

If successful, you will see an option similar to the one below in the terminal. Choose the highlighted option, blank, and proceed with the commands following.

A couple more commands to enter the directory of the project and install the necessary modules. Then we can start the app 👍:

cd rn-project 
yarn start

You will now be pleasantly presented with options for how you would like to run the app.

Software

The last step is to download the necessary software, either on your desktop or mobile device.

Here are the most commonly used options with instructions and links for any necessary downloads.

NOTE: You can choose one of the options if you are eager to get rolling, but you will want to use an Android as well as an iOS option to test both platforms (hence the reason you are using React Native as it is compatible with both platforms while only have to write the app using one stack!)

Option 1: Expo CLI app on iOS

Install the Expo Go.

Use your camera to scan the QR code from the terminal where your code is running.

Option 2: Expo CLI app on Android

Install the Expo Go.

Use the terminal on your device to scan the QR code from the terminal where your code is running.

Option 3: Android Studio — Android Emulator

Install Android Studio.

Install Android Emulator: Select the Android Emulator component in the SDK Tools tab of the SDK Manager. For instructions, see CLICK HERE.

Now in your terminal while the app is still running, type a to open your emulator and see the app!

Option 4: xCode — iOS Simulator

NOTE: MAC Only!

Download xCode for MAC.

Now to get the Simulator setup and running, in xCode, go to Window > Devices and Simulators > Simulators

Install a simulator of your choice
On the left is a list of installed Simulators
Each Simulator can be marked as “Show as run destination”

Now in your terminal while the app is still running, type ito open your emulator and see the app!

Conclusion:

Not bad for ease of use and time to get an app running in your hand, right? I appreciate you making it this far down the page! Please do like and subscribe for more articles relating to Full Stack development!

React Native Up In <5 Minutes

Here is a quick out-of-the-box way to show how easy it is to start using React Native.

Table of contents