Topic 45 of 56 · Full Stack Advanced

Topic 3 : Windows Installation

Lesson TL;DRTopic 3: Windows Installation 📖 5 min read · 🎯 beginner · 🧭 Prerequisites: postmanconfiguration, reactcomponents Why this matters Before you write a single line of React Native code, your Windows m...
5 min read·beginner·react-native · windows · android-studio · chocolatey

Topic 3: Windows Installation

📖 5 min read · 🎯 beginner · 🧭 Prerequisites: postman-configuration, react-components

Why this matters

Before you write a single line of React Native code, your Windows machine needs to be set up correctly — and this is where a lot of beginners quietly give up. Not because they can't code, but because they opened the terminal, got some cryptic error about a missing SDK or a wrong Java version, and had no idea what went wrong. I've seen it happen. We're going to make sure it doesn't happen to you. In this lesson, we'll install Node, Java, Android Studio, and set up the environment variables — every step, in order, so your machine is actually ready to build.

What You'll Learn

  • Install the required prerequisites: Node.js, Python, and the JDK
  • Set up Chocolatey as a Windows package manager
  • Install and configure Android Studio with the correct SDK components
  • Set ANDROID_HOME and PATH environment variables
  • Install the React Native CLI and scaffold a new project
  • Run a React Native app on an Android emulator

The Analogy

Think of your Windows machine as a construction site and React Native as the building you want to erect. Before any bricks go up, the site needs utilities — water, electricity, sewage — all connected in the right order. Node.js is the electrical grid, the JDK is the plumbing, and Android Studio is the crane operator's booth. Skip any one of them and the crane won't start, no matter how good your blueprints are. The environment variables are the address signs that tell every tool exactly where to find every other tool on the site.

Chapter 1: Prerequisites

Three tools must be installed before anything else touches the machine.

  1. Node.js — Download and install from nodejs.org. Choose the LTS release for the most stable experience.
  2. Python — Download and install from python.org. React Native's build toolchain uses Python scripts internally.
  3. Java Development Kit (JDK) — Download and install from AdoptOpenJDK. The JDK is required to compile Android code.

Verify each install by opening a terminal and running:

node --version
python --version
java -version

All three commands should print version strings without errors before you proceed.

Chapter 2: Installing Chocolatey

Chocolatey is a package manager for Windows — the rough equivalent of brew on macOS or apt on Linux. It streamlines installing and updating developer tools from the command line.

Step 1: Install Chocolatey

Open PowerShell as an Administrator (right-click the Start menu → "Windows PowerShell (Admin)") and run:

Set-ExecutionPolicy Bypass -Scope Process -Force; `
[System.Net.ServicePointManager]::SecurityProtocol = `
[System.Net.ServicePointManager]::SecurityProtocol -bor 3072; `
iex ((New-Object System.Net.WebClient).DownloadString('https://chocolatey.org/install.ps1'))

After the script completes, close and reopen PowerShell, then confirm the install:

choco --version

Chapter 3: Installing Android Studio

Android Studio provides the Android emulator, the SDK manager, and the build tools that React Native's Android pipeline depends on.

Step 1: Install Android Studio

Download and install Android Studio from developer.android.com/studio. During the installation wizard, confirm that all of the following components are checked:

  • Android SDK
  • Android SDK Platform-Tools
  • Android SDK Build-Tools

Step 2: Configure the Android SDK

  1. Open Android Studio.
  2. Navigate to File → Settings → Appearance & Behavior → System Settings → Android SDK.
  3. Verify that the required SDK platforms and tools are installed and up to date.

Step 3: Set Up Environment Variables

React Native's CLI needs to know where the Android SDK lives. You'll set ANDROID_HOME and extend your Path.

  1. Open the Start menu, type env, and select "Edit the system environment variables".
  2. In the System Properties window, click "Environment Variables".
  3. Under "System variables", click "New" and set:
    • Variable name: ANDROID_HOME
    • Variable value: C:\Users\<Your-Username>\AppData\Local\Android\Sdk

Then locate the Path variable under System variables, click Edit, and add these three entries:

%ANDROID_HOME%\tools
%ANDROID_HOME%\tools\bin
%ANDROID_HOME%\platform-tools

Click OK on all dialogs and restart any open terminals so the new variables are picked up.

Chapter 4: Installing the React Native CLI

The React Native CLI is the command-line tool used to create, build, and manage React Native projects.

Step 1: Install React Native CLI globally

npm install -g react-native-cli

Confirm the install:

react-native --version

Chapter 5: Creating a New React Native Project

With the environment fully configured, the class was ready to scaffold their first app.

Step 1: Create a new project

npx react-native init MyFirstApp

npx ensures you're using the latest project template even if your globally installed CLI is slightly behind.

Step 2: Navigate to the project directory

cd MyFirstApp

Your project directory now contains android/, ios/, App.tsx, and package.json, among other files.

Chapter 6: Running the App on an Android Emulator

Step 1: Start the Android Emulator

  1. Open Android Studio.
  2. Go to Tools → AVD Manager.
  3. Click the Play button next to your Android Virtual Device (AVD) to launch the emulator.

Wait until the emulator fully boots to the home screen before proceeding.

Step 2: Run the React Native app

Open a terminal inside your MyFirstApp directory and run:

npx react-native run-android

The Metro bundler will start, the app will be compiled, and it will be installed on the running emulator. You should see the default React Native welcome screen appear.

Chapter 7: iOS on Windows (Optional Note)

Running iOS apps on a Windows machine is not officially supported — Apple's toolchain requires macOS. If iOS development is a requirement, the recommended alternatives are:

  • Use a macOS machine for native iOS builds.
  • Use Expo — a managed workflow that can build iOS binaries via cloud services without a Mac.
  • Use Appetize.io — a browser-based iOS simulator for quick testing.

For Android-only projects, Windows is a fully supported first-class platform.

🧪 Try It Yourself

Task: Scaffold a new React Native project and confirm it launches on your Android emulator.

  1. Make sure your emulator is running (AVD Manager → Play).
  2. Run the following commands in sequence:
npx react-native init CouncilApp
cd CouncilApp
npx react-native run-android

Success criterion: The Metro bundler logs show BUNDLE ./index.js with no errors, and the CouncilApp welcome screen appears on the emulator. If you see a red error screen instead, check that ANDROID_HOME is set correctly by running echo %ANDROID_HOME% in a new terminal.

🔍 Checkpoint Quiz

Q1. Why must the ANDROID_HOME environment variable be set before running npx react-native run-android?

A) It tells Node.js where to install packages
B) It lets the React Native CLI locate the Android SDK tools and platform-tools
C) It sets the default Android emulator screen resolution
D) It is only required for iOS builds, not Android

Q2. Given the following terminal output after running npx react-native init MyApp, what does it indicate?

error: unknown option '--title'

A) Node.js is not installed
B) The react-native-cli version is incompatible with the current React Native template
C) Android Studio is not running
D) Python is missing from the system PATH

Q3. A developer sets ANDROID_HOME to C:\Android\Sdk but forgets to add %ANDROID_HOME%\platform-tools to Path. Which specific tool will be unreachable, and what symptom will they see?

A) adb will be missing; the emulator will fail to receive the app install command
B) gradle will be missing; the project will not compile
C) npm will be missing; package installs will fail
D) node will be missing; Metro bundler will not start

Q4. You are on a Windows machine and need to test your React Native app on an iOS device. What is the recommended approach?

A) Install Xcode for Windows from the Microsoft Store
B) Use npx react-native run-ios with the --simulator flag
C) Use Expo or Appetize.io for cloud-based iOS builds/testing
D) Install the iOS SDK via Chocolatey

A1. B — The React Native CLI delegates the Android build to Gradle, which invokes adb and other SDK binaries; without ANDROID_HOME pointing at the correct directory, those tools cannot be found.

A2. B — The --title flag was removed in newer React Native CLI versions. The template API changed; upgrading or checking the correct init syntax resolves it.

A3. A — adb (Android Debug Bridge) lives in platform-tools. Without it on Path, the CLI cannot communicate with the running emulator to push the APK.

A4. C — Apple's build toolchain (Xcode) only runs on macOS. Expo provides cloud iOS builds and Appetize.io provides browser-based iOS simulation, both accessible from Windows.

🪞 Recap

  • Node.js, Python, and the JDK must all be installed and verified before any React Native tooling is touched.
  • Chocolatey simplifies installing and maintaining Windows developer tools from PowerShell.
  • Android Studio provides the SDK, emulator, and build tools that React Native's Android pipeline requires.
  • ANDROID_HOME and the three %ANDROID_HOME% Path entries are the connective tissue that lets the CLI find SDK binaries.
  • npx react-native init <AppName> scaffolds a new project; npx react-native run-android builds and deploys it to a running emulator.

📚 Further Reading

Like this topic? It’s one of 56 in Full Stack Advanced.

Block your seat for ₹2,500 and join the next cohort.