Task 3- Installing React-Native CLI and creating our React-Native project

Open command prompt with admin privileges and use npm to globally install ‘react-native-cli’ on your system.

npm install -g react-native-cli

Once the above command completes, we would have react-native-cli installed.

Setup and initialize/scaffold our React-native project

We will use the above installed react-native-cli’s init command to initialize our React-native project

1. From the command prompt, cd to your working folder where you would like to get you project folder created.

C:\WINODWS\system32> cd C:\working

You can change to whatever is your working drive and folder e.g. C:\WINODWS\system32> cd E:\myWorkingFolder

2. Once in the working folder, create a subfolder ‘ReactNative’ using mkdir command.

C:\working> mkdir ReactNative

3. Again, cd to the above created ‘ReactNative’ folder that we created above.

C:\working> cd ReactNative

4. And finally once inside the ‘ReactNative’ folder, we run the below command

C:\working\ReactNative> react-native init momentz4ever

Once the command completes, you should see something like below in the command prompt:

The above command will create a sub-folder momentz4ever and initialize a react-native project named ‘momentz4ever’ in this folder.

Open the momentz4ever folder in your web editor (I am using VS code).

Notice the index.android.js and index.ios.js files under the root folder. These two files would have same code initially.

Also notice the ‘android’ and ‘ios’ folders.

The way react-native works is - it takes the javascript code from the index.android.js (and its module dependencies), compiles it to native android code and places this native android code inside the ‘android’ folder.

In the same way, it stores the native iOS code, that it builds from the javascript code in index.ios.js (and its module dependencies), inside ‘iOS’ folder.

Thus we essentially have a fully ready android project inside the ‘android’ folder.

For the next task, we would open this Android project from ‘Android Studio’ and then we would set up an Android phone emulator from where we will be testing our app as we develop it.