react-native-sop-docs/01-requirements/environment-setup.md

3.0 KiB

Requirements & Environment Setup

Hardware Prerequisites

Minimum Requirements:

  • macOS: macOS 10.15+ (for iOS development)
  • Windows: Windows 10+ with WSL2
  • Linux: Ubuntu 18.04+ or equivalent
  • RAM: 8GB minimum, 16GB recommended
  • Storage: 50GB free space minimum

JDK Setup

# Install JDK 11 (recommended for RN 0.70+)
# macOS (using Homebrew)
brew install openjdk@11

# Windows (using Chocolatey)
choco install openjdk11

# Linux (Ubuntu)
sudo apt update
sudo apt install openjdk-11-jdk

Configure JAVA_HOME:

# macOS/Linux - Add to ~/.zshrc or ~/.bash_profile
export JAVA_HOME=$(/usr/libexec/java_home -v 11)
export PATH=$JAVA_HOME/bin:$PATH

# Windows - Set environment variables
JAVA_HOME=C:\Program Files\OpenJDK\openjdk-11.0.x
PATH=%JAVA_HOME%\bin;%PATH%

Node.js & Package Manager

# Install Node.js LTS (18.x recommended)
# Using nvm (recommended)
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.0/install.sh | bash
nvm install 18
nvm use 18

# Install Yarn (recommended over npm)
npm install -g yarn

# Verify installations
node --version  # Should show v18.x.x
yarn --version  # Should show 1.22.x+

Android Studio & SDK Setup

  1. Download Android Studio from https://developer.android.com/studio

  2. Install Android SDK:

    • SDK Platforms: Android 13 (API 33), Android 12 (API 31)
    • SDK Tools: Android SDK Build-Tools 33.0.0, Android Emulator, Android SDK Platform-Tools
  3. Configure Environment Variables:

# macOS/Linux - Add to ~/.zshrc or ~/.bash_profile
export ANDROID_HOME=$HOME/Library/Android/sdk  # macOS
export ANDROID_HOME=$HOME/Android/Sdk          # Linux
export PATH=$PATH:$ANDROID_HOME/emulator
export PATH=$PATH:$ANDROID_HOME/platform-tools

# Windows
ANDROID_HOME=C:\Users\%USERNAME%\AppData\Local\Android\Sdk
PATH=%ANDROID_HOME%\emulator;%ANDROID_HOME%\platform-tools;%PATH%
  1. Create AVD (Android Virtual Device):
    • Open Android Studio → AVD Manager
    • Create Virtual Device → Pixel 4 → API 33 → Finish

Xcode & iOS Setup (macOS only)

# Install Xcode from App Store
# Install Command Line Tools
xcode-select --install

# Install CocoaPods
sudo gem install cocoapods

# Verify installation
pod --version

VSCode Setup

Required Extensions:

{
  "recommendations": [
    "ms-vscode.vscode-typescript-next",
    "bradlc.vscode-tailwindcss",
    "esbenp.prettier-vscode",
    "ms-vscode.vscode-eslint",
    "formulahendry.auto-rename-tag",
    "ms-vscode-remote.remote-containers",
    "ms-vscode.vscode-json"
  ]
}

VSCode Settings (.vscode/settings.json):

{
  "editor.formatOnSave": true,
  "editor.defaultFormatter": "esbenp.prettier-vscode",
  "editor.codeActionsOnSave": {
    "source.fixAll.eslint": true
  },
  "typescript.preferences.importModuleSpecifier": "relative"
}

Global Dependencies

# Install global tools
npm install -g @react-native-community/cli
npm install -g react-devtools

# macOS only
brew install watchman

# Verify React Native CLI
npx react-native --version