In native mobile development, we use two different languages Java or Kotlin for Android and Swift/objective-c for iOS.  To reduce the development time and complexity of different languages Facebook Launched ReactNative. ReactNative enables app developers to develop a single application for both the Android & iOS platforms. ReactNative uses Javascript language which makes app development tasks easy, efficient, powerful ways to develop mobile applications.

In this blog, I will explain the setup up of React Native Application for Windows. I have faced many issues on the setup for the same and at last I succeeded. I have followed the Facebook react native document for the setup

They provide us with two methods for creating the application, the first one is Expo CLI Quickstart, and the second by React-Native CLI Quickstart. In this blog, I will tell you about the React Native CLI.

There are two methods for installing the dependencies ( Node and Python2 ,JDK) ,first is using the Chocolatey, a popular package manager for Windows,second is installing the dependencies individually and then set the required path of the Environment variable but Chocolatey will help us in setting the Environment variable for us. The following steps will help you with the installation process.

Steps 1. Install Chocolatey

You can install this from the Windows PowerShell ,make it administrative then hit enter and then run the following command :

That’s it ,to ensure type choco or choco -? and hit enter

Steps 2. Installing dependencies

Open an Administrator Command Prompt (right click Command Prompt and select "Run as Administrator"), then run the following command:

choco install –y nodejs.install python2 openjdk8

Before proceeding to the next step make sure that the path for each dependency is added, you can check the path details from the Troubleshooting steps given below .

Steps 3. Install Android Studio

Installed the latest version and configure the ANDROID_HOME environment variable for SDK and platform tools from the Windows Control Panel, SDK Tools, Platform tools you can take the help from the below screenshots.

Once the Android Studio is installed into your system then click on the configuration and select the SDK Manager and then installed the below SDK Tools and Platform Tools .

Now its time to configure the path from the system environment variables.To do so follow these below steps:

1. Open the Windows Control Panel.
2. Click on User Accounts, then click User Accounts again
3. Click on Change my environment variables
4. Click on New... to create a new ANDROID_HOME user variable that points to the path to your Android SDK:

Add platform-tools to Path

1. Open the Windows Control Panel.
2. Click on User Accounts, then click User Accounts again
3. Click on Change my environment variables
4. Select the Path variable.
5. Click Edit.
6. Click New and add the path to platform-tools to the list

Steps 4. React Native Command Line Interface

In this step install the CLI globally using the following command -

npm install –g react-native-cli

Steps 5.  Initiate the project

To create the project  run the following command-

npx react-native init FirstProject

Steps 5.  Run the project

Now all the setup is done it's time to run our first React Native App using the following Command that should be passed through your Visual studio Code (Editor or IDE you can use any other as well) terminal. Prior to that, open the Android studio then select the Existing project, and then add the android folder from your project directory (make sure that you don’t have to include the whole project as the android studio works on the JAVA Language and React Native uses the JAVASCRIPT so we can’t edit our code from here )

npx react-native run-android

Also Read: React Native Tutorial Using Redux

If you find any difficulties while the installation process you can go through the below Troubleshooting steps .

Troubleshooting Steps –

After doing so much of stuff when I run my application I was encountered with an error that – 

Error- packages .ps1 cannot be loaded because running scripts is disabled on this system

So if you ever get this error ,simply you can follow these steps to solve the issue -

Step-1 Open Windows Powershell with Run As Administrator.

Step-2 - Use this command on Windows Powershell to get it.

Get-ExecutionPolicy

Step-3 Now we need to change this policy to allow the operation. Use this command to make it Unrestricted –

Set-ExecutionPolicy Unrestricted 

That's it. To confirm you may check the execution policy status by this command again.

Get-ExecutionPolicy

Error: Failed to install the app. Ensure that you have the Android development environment set up: https://facebook.github.io/react-native/docs/getting-started.html#android-development-environment. Run CLI with --verbose flag for more details.

For which I had followed some steps which will help you a lot with the same issue –

First Check whether your emulator is running or plugging device is plugged properly or not , If not then Fix them then run the application .You can also check the whether device is connected or not using the ADB command and it will return you the list of adb devices .

adb devices

other ADB commands that are mostly used are –

adb kill-server

adb start-server

If the above step will not help you then check whether all the dependencies path are giving properly or not from the environment variable, If the path is not correct then fix them and run the application.

To check the dependencies path

• Open the Windows Control Panel.
• Click on User Accounts, then click User Accounts again
• Click on Change my environment variables

If above these steps will not help you then be patient take a long breath and follow the below steps :

Run react-native info and it will return the List of all packages included in your project and what is missing so edit your issue to include these results under the Environment section.

As you can see, in my case NDK was not found, and also the React-Native –CLI was not globally found so for that I go to the Android Studio and then from the SDK platform tools I had installed the NDK, and then I had Run the Command npm install –g react-native-cli to install the CLI interface globally this solution helps me in resolving the issue.

Error : Failed to install the app. Please confirm you have the Android development environment set up by clicking on this link: https://facebook.github.io/react-native/docs/getting-started.html#android-development-environment. Run CLI with --verbose flag for more details.

Error: Command failed: ./gradlew app:installDebug -PreactNativeDevServerPort=8081

:ReactNative:Running 'npx --quiet --no-install react-native config' command from 'null' directory failed.

To solve this issue first I clean the gradle from the project directory using the below Commands 

Cd android, then run gradlew clean
after clean gradle the run cd.. and run npx react-native run-android

Error : Failed to run jetifier React Native

To solve this issue you have to use  the below command and it removes the errors from my project

react-native run-android --no-jetifier

Error: Unable to locate adb

To solve this issue you have to open Studio settings-->System settings --> Android SDK --> select SDK tool tab -->> select "Android SDK platform tool" and install

Official Link:

https://reactnative.dev/docs/environment-setup

We are a SaaS application development company that provides end-to-end mobile app development services with a focus on cutting-edge technologies. Our development team uses JavaScript tools like Angular, Node, and ReactJS to make it adaptable, responsive, and include rich web applications to address different business prerequisites. We have an experienced team of Full Stack engineers that are skilled at performing both frontend and backend assignments. Our SaaS app development services address your project requirements by developing user-friendly apps that are easy to scale.