How To Install React Native On Windows

Hi, readership! This article is a helpful guide about how to install React Native on Windows.

React Native is a JavaScript framework that allows you to build mobile applications across platforms, so you build it in JavaScript and then you run it through the compiler. Then it will generate it in Android or iOS.

Before we begin, I have to say that I will show how to install all the necessary components that are required to run an app on your computer with Windows.

The first thing we need to do is to install Node because that’s how we will actually run the React Native. Node is a server-side JavaScript framework and we need that in order to run the React Native code. After that we will install the Android Studio, because we need to have an emulator.

So, download NodeJS from https://nodejs.org/en/download/ and we are going to use the expo CLI QuickStart.

After you downloaded it, go to your downloads folder and run the installation process. Once NodeJS is installed, click finish and then we’re going to open up a command line just to verify that it’s been installed.

Type node -v, then npm -v. This will actually be the module that we will use to install the other packages and plugins. It works because that installer added it to the path of your computer.

In addition, you can just connect your phone to the computer instead of the emulator. To download the emulator, go this link https://developer.android.com/studio/. Then install it on your system. Make sure that Android virtual devices are checked off because that’s where the emulators actually run.

Once it is completed, click finish and start Android Studio. When it’s been installed and it says “Android SDK’s up-to-date, we are going to configure it. Click “configure” and then “AVD manager”. This will install our virtual device. The next step you need to do is to create a device which you want.

Now, we need to install the packages. Go ahead and open up your command line again and type in the command npm install -g expo-cli. This will take a while.

So, once you get all this big mess of downloaded log, all this deprecated stuff, that’s fine. Once we’ve installed expo or ready to create the actual application now, we go ahead into our command line and paste the command cd Documents. Then expo init projectname.

Let all of the components finish downloading and in the meantime we can actually start our emulator.

After the emulator is launched, type in the command line cd projectname, then npm start.

It may happen that the error will occur while the process. In this case, go into your project directory, find the folder with your project name and then into the folder “Node modules”. Scroll all the way down to Metro-config, then into the source (SRC) file, then “defaults”, the “blacklistJS” . Click “edit” on it and the problem that arose is because of the invalid characters. The way we have to deal with this is only in the first line. In this declaration of shared blacklist in the first line in the square brackets add a backslash (\) in front of every forward slash (/). Click save and exit.

So, we go back to our emulator and press “a”. If you have connected a physical phone, you have to download the expo app on Android and then scan the QR code that appears on the screen.

After pressing “a”, it will run the expo on the virtual device. Go ahead into settings and follow the instructions. Then press the back button and it’s gonna start building the JavaScript bundle. If it doesn’t show up automatically or goes back to the home screen, just press “a” again in order to launch the app again.

So, that’s it! I hope that you guys have understood how to install React Native on Windows. Go for your amazing React Native development. Good luck!