React Native

How to Install and Setup React Native on Ubuntu

Google+ Pinterest LinkedIn Tumblr

Welcome guys, In this article, We will learn how to install and setup up React Native on Ubuntu. You will have to follow all the below step one by one. I assure you the end of this article you feel happy and save a lot of time.

I’m assuming you are using Ubuntu machine and you have admin access. Let go head with below step.

1. Install Node.JS and npm

Firstly, We have to install Node.JS and npm for React Native mobile app development. Let’s move to terminal.

1.1 Update apt package manager
 sudo apt update     
1.2 Install nodejs using apt package manager. just run below command
sudo apt install nodejs npm 
1.3 Verify nodejs installation or you can say check nodejs version using this command
nodejs --version
1.4 Now install npm
sudo apt install npm
1.5 Verify the installation
 npm --version or npm -v

2. Furthermore, Install React Native CLI

For installing React Native CLI run below command on terminal
npm install -g react-native-cli

If you get an error like Cannot find module ‘npmlog’ you can install npm directly using this command. If the above command run successfully then no need to run this command

curl -0 -L https://npmjs.org/install.sh | sudo sh

3. Install Java Development Kit

To install JDK 8, follow the below steps

3.1 First, We have to add Oracle’s PPA
sudo add-apt-repository ppa:webupd8team/java
3.2 Now  update your package repository.
sudo apt update

Now install Oracle JDK 1.8, that recommended version for React Native Development. You can install using the following command

sudo apt install oracle-java8-installer
3.4 Set default Version

You can install multiple Java Installation in one machine version. For React Native mobile app development 1.8 is more stable. Consequently, we will need to set Java 1.8 as default, for do that run the below command

sudo apt install oracle-java8-set-default
3.5 Now verify java installation
javac -version

4. Android development environment

Setting up your development environment is a little bit difficult, So I would like to suggest you go with easy step

4.1 Install AndroidStudio

Download and install Android Studio You can have to recommend installation type. If you are familiar with AndroidStudio, You can Choose a “Custom” setup when prompted to select an installation type. And ensure the boxes next to all of the following are checked:

  • Android SDK
  • Android SDK Platform
  • AVD (Android Virtual Device)

But I personally recommend you have to choose recommend type during installation

4.2 Now, Configure the ANDROID_HOME environment variable

Now we have to set up some environment variables. Because React Native tools require some environment variables to be set up in order to build apps with native code.

4.3 Go to terminal and run command
$HOME/.bash_profile 

Now on file will open in terminal copy the below line and save the file

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

If you not able to edit this file you can run these command on terminal also

5. Creating a Sample application

For do that open terminal and goes into the folder where you want to create a new project and run the below command

react-native init SampleProject

6. Preparing AndroidDevice

You will need to Android device to run your ReactNative App. It can be either physical or virtual Android device .

6.1 Physical Device

For running app for physical device you will need to Enable Debugging over USB and  Plug in your device via USB

6.2 Virtual Device (emulator)

To do that open the android studio and create a virtual device . and power up AVD.

6.3 Verifying device is connected or not run this command
adb devices

After running this command list of connected devices will display on terminal

7. Run React Native App

Go to inside the project folder
cd SampleProject

8. Finally run the app the app using this command

react-native run-android

That’s it!

Congratulations! You’ve successfully run your first React Native app.

Author

Write A Comment