How to setup environment in react native

How to setup environment for react native

There are two ways you can install react native in your system one is for those who are new to react native, and other is for those who know app development or have basic knowledge about it.

setup environment for react native

  1. Quick start with Expo CLI – for beginners
  2. Start with React native CLI – those who have some knowledge

1. Quick start with Expo cli –

First requirement is that we need npm for install any package NPM v12 LTS 

Next step is to install Expo CLI command line –

For that go to command prompt and then type 

npm install -g expo-cli

Now you can create react native app from this expo CLI

expo init ReactnativeTutorials

Here put your app name instead of ReactnativeTutorials for example if i want to create an app for my site then i write expo init ReactnativeGuides.

Now a new directory is created at that location of your project name, go to that directory 

cd ReactnativeTutorials

And enter these for start your app

npm start

You can also use expo command here

expo start

Now the question arises in your mind that how can you run this app on your device 

For that you just have to download the official expo client app in your android or ios device.

Another requirement is that your device and system where you code are must be on the same wireless network.

Now just scan the QR code from your device, QR code is visible on the terminal

In android QR code scanner is available in your expo app but on ios you have to do it with inbuilt camera app.

So currently your app is running on your device just change the default App.js and your app is gonna reload automatically and start coding.

You can choose any text editor you want.

Some guidelines regarding expo –

For checking some expo related stuff you can go to their documentation. In future i am gonna add that to this site also.

Expo also has some problems and limitations like some native libraries you can’t use with expo, but i suggest in future you can export the app through expo and make it react native cli app. 

For that just run

expo eject

If you have any virtual device in your system then run these commands 

For android – npm run android

For ios – npm run ios

2. Start with react native CLI

The method of installation is different on the platforms

  1. Android
  2. Ios

1. Android –

For android installation firstly you need Node, paython2 and jdk. You can use Chocolatey

for that.

For Chocolatey open PowerShell as administrator and run this command

Set-ExecutionPolicy Bypass -Scope Process -Force; [System.Net.ServicePointManager]::SecurityProtocol = [System.Net.ServicePointManager]::SecurityProtocol -bor 3072; iex ((New-Object System.Net.WebClient).DownloadString('https://chocolatey.org/install.ps1'))

Now Chocolatey is in your system for more information go to Chocolatey installation.

Now open command prompt as administrator and run

choco install -y nodejs.install python2 jdk8

Now you have to set android development environment

You need to install android studio, for download go to Android Studio.

Also install Virtual devices for tasting if you don’t want to use your own device or any other emulator.

2. IOS –

install dependencies of node and watchman

brew install node
brew install watchman

install cocoapods

sudo gem install cocoapods

Code Editor

There are many code editors which you can use like sublime text, webstorm, visual studio etc. according to your convenience.

One Reply to “How to setup environment for react native”

Leave a Reply

Your email address will not be published. Required fields are marked *