Running react-native app in ubuntu 18.04

dooboolab
dooboolab
Jul 7, 2018 · 3 min read

These day, I’ve figured out that configuring react-native dev environment is quite difficult than it is in mac. In this article, I will explain how to setup your environment to build react-native app in ubuntu 18.04.

1. Install node and npm

If you are already an ubuntu user, or if you already have an experience in ubuntu, you may be familiar with installing node via apt like apt-get install nodejs. However, these day, it is recommended to install node via nvm which is a package manager for nodejs. Therefore, lets install nvm first.

  • Install nvm
apt-get update// install c++ compiler. It may already exists, but just in case.
apt-get install build-essential libssl-dev
// install nvm
curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.34.0/install.sh | bash
// reload bash
source ~/.bashrc
// after installation close and reopen terminal and check nvm version
nvm --version
  • Install node
// install latest node
nvm install node
// set default node version for nvm
nvm alias default node
// check version of node and npm
node -v
npm -v

2. Install Android Studio

  • Install Java
sudo apt install openjdk-8-jre openjdk-8-jdk
  • Install android studio
/*
In ubuntu 18.04, snap command is provided which is
containerised software packages that are simple to create and
install on all linux distributions.
https://snapcraft.io/
*/
sudo snap install android-studio
  • Configure build path in your .bash_profile or .zshrc
export ANDROID_HOME=$HOME/Android/Sdk
export PATH=$PATH:$ANDROID_HOME/tools
export PATH=$PATH:$ANDROID_HOME/tools/bin
export PATH=$PATH:$ANDROID_HOME/platform-tools
export PATH=$PATH:$ANDROID_HOME/emulator
# Set alias to shorten command to run emulator
alias run-emu="$ANDROID_HOME/tools/emulator @pixel2"

Reload bash_profile or .zshrc

source ~/.bash_profile // or source ~/.zshrc
  • Generate emulator & run emulator
/**
Note:
- In order to make `avdmanager` command to work, you should
start android-studio and complete installation first.
- Also system-images should be installed Type below command to
install the system image.
* sdkmanager --install "system-images;android-27;google_apis;x86"
**/
// Create avd device
avdmanager create avd -n doo1 -k "system-images;android-27;google_apis_playstore;x86" --device 'Nexus 5X
// run emulator
emu -avd doo1
  • List emulators. You will see doo1 as a result.
emu -avd -list-avds
  • To install pixel device, you can do following.
// install missing module
sudo apt-get install libcanberra-gtk-module:i386
// create avd
avdmanager create avd -n doo1 -k "system-images;android-28;google_apis;x86" --device 'pixel'
  • Trouble shooting with permission
/** 
Sometimes there is permission issue running device telling to
grant permisson on `/dev/kvm`.
**/
sudo apt install qemu-kvm
sudo adduser <your username> kvm
sudo chown <your username> /dev/kvm

3. Install react-native

  • Install react-native-cli using npm.
npm install -g react-native-cli
  • Create react-native project via react-native-cli.
react-native init DoobooProject
  • Finally run your react-native project.
// Move to created project dir.
cd DoobooProject
// Start react-native packager
npm start
// open up another terminal and run android
react-native run-android

Troubleshoot

  1. When facing below error,
solution: run below in terminal.
echo fs.inotify.max_user_watches=524288 | sudo tee -a /etc/sysctl.conf && sudo sysctl -p

dooboolab

Open source community

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch

Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore

Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store