INSTALLATION

INSTALL NODEJS

Since React native is a framework of JavaScript, it requires to have Nodejs(A JavaScript runtime) installed.

curl -sL https://deb.nodesource.com/setup_9.x | sudo -E bash -
sudo apt-get install -y nodejs

INSTALL NPM

NPM will be installed with the Nodejs installation itself. However, you can install the latest version for npm.

sudo npm install npm@latest -g

INSTALL JDK

Usually, Native Android apps build in Java. So Java Development Kit is required.

sudo add-apt-repository ppa:openjdk-r/ppa
sudo apt-get update
sudo apt-get install openjdk-8-jdk

INSTALL ANDROID STUDIO

Android studio needs to be installed for working with React Native development. You can easily download it from

https://developer.android.com/studio/index.html

INSTALL ANDROID SDK

Android Studio installs the latest Android SDK by default. Building a React Native app with native code, however, requires the Android 6.0 (Marshmallow) SDK in particular. Additional Android SDKs can be installed through the SDK Manager in Android Studio.

The SDK Manager can be accessed from the Welcome to Android Studio screen. Click on Configure, then select SDK Manager. SDK manager > SDK platforms then check the box next to Show Package Details in the bottom right corner. Look for and expand the Android 6.0 (Marshmallow) entry, then make sure the following items are all checked:

Google APIs
Android SDK Platform 23
Intel x86 Atom_64 System Image
Google APIs Intel x86 Atom_64 System Image

CONFIGURE ANDROID_HOME ENVIRONMENT VARIABLE

The React Native tools require some environment variables to be set up in order to build apps with native code.

export ANDROID_HOME=$HOME/Android/Sdk 
export PATH=$PATH:$ANDROID_HOME/tools 
export PATH=$PATH:$ANDROID_HOME/platform-tools

sudo nano ~/.bash_profile Paste the copied code on the terminal screen.

Press Ctrl + O (Write out) Press Enter Press Ctrl + x (exit)

INSTALL WATCHMAN

Watchman is a tool used for watch files and record when they change. It is essential where you need Live reloading of apps when code changes.

git clone https://github.com/facebook/watchman.git
cd watchman
git checkout v4.9.0  # the latest stable release
./autogen.sh
./configure
make
sudo make install

INSTALL REACT NATIVE CLI

You can easily install react native CLI using npm.

sudo npm install -g react-native-cli

CHOOSING YOUR PROJECT DESTINATION (optional)

In your Ubuntu system, you can choose any destination to do your projects. But in my case, I will choose /var/www/html for doing all the projects in Ubuntu. It is just the default root folder of the web server of your Ubuntu system.

cd /var/www/html

CREATING NEW APPLICATION

Using react native CLI, you can create a new React Native project.

react-native init AwesomeProject

RUNNING YOUR APPLICATION ON YOUR ANDROID DEVICE

Now you need to run the project in your Android phone(It is recommended you to use Android 6.0 and devices, but lower versions are also compatible).

On your mobile device,

Go to Settings->About

You can see a Build Version menu there. Continually click the option until it enables the Developer options

Now, return to Settings. You can see the Developer options menu there. Enable it. Also, enable the USB debugging option in it.

Connect your mobile device with your Ubuntu system using the USB port. Type the below command to check whether your mobile device is connected or not.

adb devices

Now, From the VS studio terminal, run

react-native run-android

johnatandias/DevelopmentEnvironmentReactNative.md