React Native Environment Setup

Before writing a single line of React Native code, your computer needs the right tools. This topic walks through every tool you need and explains why each one exists.

Two Ways to Start

React Native gives you two paths to get started. Choose the one that fits your situation.

┌─────────────────────────────────────────────────┐
│             Which path suits you?               │
└────────────────────┬────────────────────────────┘
                     │
        ┌────────────┴────────────┐
        ▼                         ▼
┌───────────────┐         ┌───────────────┐
│  Expo Go      │         │  React Native │
│  (Beginners)  │         │  CLI (Pros)   │
│               │         │               │
│ No Xcode or   │         │ Full control  │
│ Android setup │         │ Native code   │
│ needed        │         │ access        │
│               │         │               │
│ Best for:     │         │ Best for:     │
│ Learning      │         │ Production    │
└───────────────┘         └───────────────┘

This course uses Expo for the first half because it removes installation complexity. You will see the React Native CLI approach in later topics.

Tools You Need

Node.js

Node.js lets JavaScript run on your computer outside a browser. React Native's tooling is built on Node.js. Download the LTS version from nodejs.org. LTS means Long Term Support — the stable version.

After installing, verify with:
$ node --version
v20.x.x   ← should show a version number

$ npm --version
10.x.x    ← npm comes bundled with Node.js

npm or Yarn

npm stands for Node Package Manager. It downloads and manages JavaScript libraries for your project. Yarn is an alternative that works the same way. npm comes installed with Node.js, so you already have it once Node.js is set up.

Expo CLI

Expo is a platform built on top of React Native. The Expo CLI is a command-line tool that creates and runs your project. Install it with this command:

$ npm install -g expo-cli

The -g flag installs it globally so you can use it from any folder on your computer.

Expo Go App

Install the Expo Go app on your physical phone from the App Store (iOS) or Google Play (Android). This app reads your project code and shows it on your phone in real time. You see changes instantly without building the full app every time.

Your Computer              Your Phone
┌────────────────┐         ┌────────────────┐
│ expo start     │─────────│ Expo Go App    │
│ (runs server)  │  Wi-Fi  │ (shows your    │
│                │◄────────│  app live)     │
└────────────────┘         └────────────────┘
        Both must be on the same Wi-Fi network

Code Editor — VS Code

Visual Studio Code (VS Code) is the most popular editor for React Native development. Download it free from code.visualstudio.com.

Install these VS Code extensions for the best experience:

  • ES7+ React/Redux/React-Native snippets — adds shortcuts for common code patterns
  • Prettier — formats your code automatically
  • ESLint — highlights code errors before you run the app

Optional: Android and iOS Emulators

An emulator is a fake Android or iOS device that runs on your computer. You do not need a physical phone to test your app if you set up an emulator.

Android Emulator

Install Android Studio from developer.android.com. During setup, choose to install the Android Virtual Device (AVD) Manager. Create a virtual device through the AVD Manager. This gives you a simulated Android phone on your screen.

iOS Simulator (Mac only)

The iOS Simulator comes with Xcode. Xcode is only available on macOS. If you use Windows or Linux, you cannot run the iOS Simulator. You still test iOS apps using a physical iPhone with Expo Go.

Operating System | Android Emulator | iOS Simulator
─────────────────|─────────────────|──────────────
macOS            | ✓ Yes           | ✓ Yes (Xcode)
Windows          | ✓ Yes           | ✗ No
Linux            | ✓ Yes           | ✗ No

Setup Checklist

Work through this list before moving to the next topic. Every item must be checked off.

[ ] Node.js installed — `node --version` shows output
[ ] npm working     — `npm --version` shows output
[ ] Expo CLI installed — `expo --version` shows output
[ ] VS Code installed with extensions
[ ] Expo Go installed on your phone
[ ] Computer and phone on the same Wi-Fi

Troubleshooting Common Problems

Command Not Found Error

If your terminal says "command not found" after installing Node.js, close the terminal completely and open it again. The terminal needs to reload its list of available commands.

Expo Go Cannot Find Your Project

Both your phone and computer must be on the same Wi-Fi network. If they are on different networks, the Expo Go app cannot reach your project server.

Port Already in Use

Expo uses port 8081 by default. If another program uses that port, Expo will ask to use a different port. Accept the suggestion and continue.

Summary

You need Node.js, Expo CLI, VS Code, and the Expo Go app on your phone. That combination gives you a complete React Native development environment without heavy configuration. The next topic uses all these tools to create your first working app.

Leave a Comment