Why Learn How to Install and Launch a React Native App?

React Native enables developers to build native apps for Android and iOS with a single codebase, making it one of the most efficient solutions for modern mobile app development. Learning how to install and launch a React Native app equips you with the tools to build, test, and iterate rapidly across multiple platforms.

System Requirements

• Node.js (LTS version recommended)
• npm or Yarn for package management
• Git installed on your machine
• Java Development Kit (JDK 11+) for Android builds
• Xcode (for macOS users targeting iOS)
• Android Studio for Android emulator and SDK

Step 1: Install Node.js and Watchman

1. Download and install Node.js from nodejs.org
2. macOS users should also install Watchman:

   brew install watchman

Step 2: Install the React Native CLI

npm install -g react-native-cli

Step 3: Set Up Android and iOS Environments

Android Setup

1. Download Android Studio
2. Install Android SDK, Emulator, and Platform Tools during setup
3. Add Android SDK location to your environment variables:

   
   export ANDROID_HOME=$HOME/Library/Android/sdk
   export PATH=$PATH:$ANDROID_HOME/emulator
   export PATH=$PATH:$ANDROID_HOME/tools
   export PATH=$PATH:$ANDROID_HOME/platform-tools
       

4. Create and launch a virtual device (AVD) in Android Studio

iOS Setup (macOS only)

1. Install Xcode from the App Store
2. Accept Xcode license in terminal:

   sudo xcodebuild -license

3. Install command-line tools:

   xcode-select --install

Step 4: Create Your React Native Project

npx react-native init MyFirstApp

This command creates a folder MyFirstApp with the necessary starter files.

Step 5: Launch Your React Native App

For Android

1. Start an emulator via Android Studio or run:

   npx react-native run-android

For iOS (macOS only)

1. Make sure a simulator is running
2. Run:

   npx react-native run-ios

Alternative Method: Using Expo CLI

Expo provides an easier setup and is ideal for beginners or web developers transitioning to mobile.

1. Install Expo CLI globally:

   npm install -g expo-cli

2. Create a new Expo app:

   expo init MyExpoApp

3. Navigate into the app directory and start the project:

   cd MyExpoApp
   expo start

4. Scan the QR code using the Expo Go app (iOS/Android) to preview the app on your phone

Project Folder Overview

• App.js: The main file where your app’s UI begins
• android/ and ios/: Native folders used for platform-specific code
• package.json: Manages project dependencies

Best Practices

• Use npx to avoid global installs unless necessary
• Keep Node and React Native CLI updated
• Test on both emulators and physical devices
• Write modular and reusable components

Troubleshooting Common Errors

• Build failed with error