react-native Getting started with react-native Setup for Windows
Example
Note: You cannot develop react-native apps for iOS on Windows, only react-native android apps.
The official setup docs for react-native on windows can be found here. If you need more details there is a granular guide here.
Tools/Environment
- Windows 10
- command line tool (eg Powershell or windows command line)
- Chocolatey (steps to setup via PowerShell)
- The JDK (version 8)
- Android Studio
- An Intel machine with Virtualization technology enabled for HAXM (optional, only needed if you want to use an emulator)
1) Setup your machine for react native development
Start the command line as an administrator run the following commands:
choco install nodejs.install
choco install python2
Restart command line as an administrator so you can run npm
npm install -g react-native-cli
After running the last command copy the directory that react-native was installed in. You will need this for Step 4. I tried this on two computers in one case it was: C:\Program Files (x86)\Nodist\v-x64\6.2.2. In the other it was: C:\Users\admin\AppData\Roaming\npm
2) Set your Environment Variables
A Step by Step guide with images can be found here for this section.
Open the Environment Variables window by navigating to:
[Right click] "Start" menu -> System -> Advanced System Settings -> Environment Variables
In the bottom section find the "Path" System Variable and add the location that react-native was installed to in step 1.
If you haven't added an ANDROID_HOME environment variable you will have to do that here too. While still in the "Environment Variables" window, add a new System Variable with the name "ANDROID_HOME" and value as the path to your android sdk.
Then restart the command line as an admin so you can run react-native commands in it.
3) Create your project In command line, navigate to the folder you want to place your project and run the following command:
react-native init ProjectName
4) Run your project Start an emulator from android studio Navigate to the root directory of your project in command line and run it:
cd ProjectName
react-native run-android
You may run into dependency issues. For example, there may be an error that you do not have the correct build tools version. To fix this you will have to open the sdk manager in Android Studio and download the build tools from there.
Congrats!
To refresh the ui you can press the r key twice while in the emulator and running the app. To see developer options you can press ctrl + m.
