I recently needed to get a new React Native + Expo project up and running on my Windows machine and found that the documentation was a little scattered, especially in terms of setting up Watchman and Android Studio to run an Android emulator. I wanted to walk through my process to hopefully make life easier for other Windows users that run into this issue. Unfortunately, iOS development on Windows is not possible (boo!).
I would also like to take a moment to urge open source developers to give Windows a little love when possible. Not everyone is on a Mac, for personal preference or financial reasons, especially outside of the United States.
Please note that I am going to assume that you have Node 8.3 or newer installed. If you don't, I would recommend using an NVM alternative for Windows for better management of Node versions. Check out this article for help getting this set up (I use the first option covered in the article).
1. Install React Native CLI
Installing React Native CLI on Windows is the same as on macOS:
npm install -g react-native-cli
2. Install Expo CLI
Installing Expo CLI on Windows is the same as on macOS:
npm install -g expo-cli
3. Install Watchman
Watchman allows you to see changes in Expo when you make a code change in your React Native app without having start everything up again. In macOS, you can use Homebrew to install Watchman, but unfortunately on Windows it's not even available on chocolatey so it's a bit more involved than that. You will need to follow the instructions on this page to get the binary download, extract the ZIP file, and add the windows\bin directory to your PATH environment variable.
4. Install Python2
You will need to install Python2 if you don't already have it. If you have chocolatey on your Windows machine, you will need to open an administrator command prompt (right click Command Prompt and select "Run as Administrator", then run the following command:
choco install -y python2
5. Install JDK
You will need to install the latest JDK (Java Development Kit), found here, or with chocolatey, open an administrator command prompt as above and run:
choco install -y jdk8
6. Install Android SDK and Android Studio
The Android SDK comes bundled in Android Studio, the official IDE for native Android Development and what we will be using for running Android emulators. Android Studio can be downloaded here. Choose a "Custom" setup and ensure that the following components are checked:
- Android SDK
- Android SDK Platform
- Performance (Intel ® HAXM)
- Android Virtual Device
These components can be installed later if needed.
For React Native, you need the Android 9 (Pie) SDK installed. Refer to the React Native CLI Quickstart tab on the React Native Get Started docs under "Android development environment" for excellent instructions on installing the Android SDK, configuring the ANDROID_HOME environment variable, and adding the platform-tools to Path.
7. Preparing an Android Virtual Device (AVD)
On the Android Studio welcome screen, select "AVD Manager" or "Configure" and then "AVD Manager". This is where you will create new AVDs as well as manage and launch AVDs you have already created.
Per the React Native docs:
Select "Create Virtual Device...", then pick any Phone from the list and click "Next", then select the Pie API Level 28 image.
Click "Next" then "Finish" to create your AVD. At this point you should be able to click on the green triangle button next to your AVD to launch it, then proceed to the next step.
8. Create and Run a React Native + Expo Project
You can create a React Native project with the following command in the directory you want it to be created in:
expo init projectname
cd projectname
npm run start
Then, select a to launch your app with Expo on your launched AVD.
Note that you can also launch the app on your phone by installing Expo on your phone and using the QR code that Expo should give you on your Windows machine.
Helpful Resources
Here are the resources I found useful when figuring this out for my own machine.
- Binary Downloads for Linux, macOS and Windows (Beta)
- Quick Tip: Installing React Native
- React Native Getting Started Docs
Conclusion
I hope this is helpful to Windows users out there who may be a little lost in setting up all the tools needed for React Native, Expo, and Android development on Windows. I know I was when I first started out, especially Android Studio as it is a beast of an IDE if you aren't familiar with it! Have fun building! 💖
Top comments (2)
You made it a cakewalk for windows folks. Appreciate your efforts in putting this together.
One suggestion I have for the people reading this in October 2021 or later is that Watchman installation location may have been updated ( instead of windows/bin it may be python/bin) and I have this location set ( I have not tested the set up yet) , Commenting before I forget
C:\DevSetups\watchman-2021.10.04.00\watchman-2021.10.04.00\watchman\python\bin
Thank you for this, I was searching for it!