react-native/docs/QuickStart-GettingStarted.md

id	title	layout	category	permalink	next
quick-start-getting-started	Getting Started	docs	Quick Start	docs/getting-started.html	tutorial-core-components

Target: iOS Android Development OS: Mac Linux Windows

Unsupported

Unfortunately, Apple only lets you develop for iOS on a Mac machine. Please check out the Android instructions instead.

Installing React Native

There's a few things you need to install first. You will need Node.js, the React Native command line tools, Watchman, and Xcode.

Installing React Native

There's a few things you need to install first. You will need Node.js, the React Native command line tools, Watchman, and Android Studio.

Node.js

We recommend installing Node.js via Homebrew, a popular package manager for OS X:

brew install node

React Native command line tools

Use Node's package manager to install the React Native command line tools. These will allow you to easily create your first React Native project.

npm install -g react-native-cli

If you see the error, EACCES: permission denied, please run the command: sudo npm install -g react-native-cli.

Watchman

Watchman is a tool by Facebook for watching changes in the filesystem. It is recommended you install it for better performance.

brew install watchman

Xcode

You can install Xcode via the Mac App Store, or download it directly from the Apple Developer portal.

Android Studio

Download and install Android Studio.

Gradle Daemon

While optional, enabling Gradle Daemon will greatly improve incremental build times for changes in Java code.

Installing React Native

There's a few things you need to install first. You will need Node.js, the React Native command line tools, Watchman, and Android Studio.

Node.js

Follow the installation instructions for your Linux distribution to install Node.js 4 or newer.

We recommend installing Node.js via Chocolatey, a popular package manager for Windows. Open a Command Prompt as Administrator, then run the following command:

choco install nodejs.install

Python

The React Native command line tools require Python2. Install it using Chocolatey:

choco install python2

React Native command line tools

Use Node's package manager to install the React Native command line tools. These will allow you to easily create your first React Native project.

npm install -g react-native-cli

If you see the error, EACCES: permission denied, please run the command: sudo npm install -g react-native-cli.

Android Studio

Download and install Android Studio.

Watchman

Watchman is a tool by Facebook for watching changes in the filesystem. It is recommended you install it for better performance. You can follow the Watchman installation guide to compile and install from source.

Gradle Daemon

While optional, enabling Gradle Daemon will greatly improve incremental build times for changes in Java code.

Testing your React Native Installation

Use the React Native command line tools to generate a new React Native project called "AwesomeProject", then run react-native run-ios inside the newly created folder.

react-native init AwesomeProject
cd AwesomeProject
react-native run-ios

If everything is set up correctly, you should see your new app running in the iOS Simulator shortly.

You can also open the AwesomeProject folder in Nuclide and run the application, or open ios/AwesomeProject.xcodeproj and hit the Run button in Xcode.

Use the React Native command line tools to generate a new React Native project called "AwesomeProject", then run react-native run-android inside the newly created folder.

react-native init AwesomeProject
cd AwesomeProject
react-native run-android

If everything is set up correctly, you should see your new app running in your Android emulator shortly.

You can also open the AwesomeProject folder in Nuclide and run the application.

Modifying your app

Now that you have successfully run the app, let's modify it.

• Open index.ios.js in your text editor of choice and edit some lines.
• Hit Command⌘ + R in your iOS Simulator to reload the app and see your change!

• Open index.android.js in your text editor of choice and edit some lines.
• Press the R key twice or select Reload from the Developer Menu to see your change!

That's it!

Congratulations! You've successfully run and modified your first React Native app.

Testing your React Native Installation

Use the React Native command line tools to generate a new React Native project called "AwesomeProject", then run react-native run-android inside the newly created folder.

react-native init AwesomeProject
cd AwesomeProject
react-native run-android

If everything is set up correctly, you should see your new app running in your Android emulator shortly.

A common issue is that the packager is not started automatically when you run react-native run-android. You can start it manually using react-native start.

If you hit a ERROR Watcher took too long to load on Windows, try increasing the timeout in this file (under your node_modules/react-native/).

Modifying your app

Now that you have successfully run the app, let's modify it.

• Open index.android.js in your text editor of choice and edit some lines.
• Press the R key twice or select Reload from the Developer Menu to see your change!

That's it!

Congratulations! You've successfully run and modified your first React Native app.

Common Followups

• If you want to run on a physical device, see the Running on iOS Device page.

• If you want to run on a physical device, see the Running on Android Device page.

• If you run into any issues getting started, see the Troubleshooting and Debugging pages.

Common Followups

• If you want to run on a physical device, see the Running on Android Device page.

• If you run into any issues getting started, see the Troubleshooting and Debugging pages.