Skip to main content

System Requirements

Required Tools

  • Node.js: Version specified in .nvmrc (currently 20.x)
  • npm: Comes with Node.js
  • Git: For version control
  • nvm: Recommended for Node version management
  • watchman: Required for React Native development

Platform-Specific Requirements

  • macOS: Required for iOS development
  • Windows/Linux: Can develop for Android and Web
  • All Platforms: Can develop for Web

General Setup

1. Install nvm

macOS/Linux

Windows

Use nvm-windows.

2. Install Node.js and npm

3. Install Watchman

macOS

Linux

Windows

Not required for Windows development.

4. Clone Repository

Web Development

Setup

No additional setup required beyond general setup.

Running the Web App

The app will be available at http://localhost:8080.

External Contributors

Set this environment variable to avoid CORS errors:

Troubleshooting Web

CORS Errors

Solution: Remove .env file or set USE_WEB_PROXY=true.

Port Already in Use

iOS Development

macOS only: iOS development requires macOS and Xcode.

Prerequisites

  1. Xcode: Install from App Store (latest stable version)
  2. Xcode Command Line Tools:
  3. CocoaPods: Install Ruby dependencies

Setup

Running on iOS Simulator

Running on Physical Device

See HOW_TO_BUILD_APP_ON_PHYSICAL_IOS_DEVICE.md.

Troubleshooting iOS

Pod Install Fails

Build Fails

Simulator Not Opening

Android Development

Prerequisites

  1. Java Development Kit (JDK)
  2. Android Studio
    • Download from developer.android.com
    • Install with default settings
    • Open Android Studio and complete initial setup
  3. Android SDK
    • Open Android Studio > Settings > Appearance & Behavior > System Settings > Android SDK
    • Install:
      • Android SDK Platform 34
      • Android SDK Build-Tools 34.0.0
      • Android SDK Command-line Tools

Environment Variables

Add to .bashrc, .zshrc, or .bash_profile:
Reload shell:

Create Android Virtual Device (AVD)

  1. Open Android Studio
  2. Tools > Device Manager
  3. Create Virtual Device
  4. Select a device (e.g., Pixel 6)
  5. Select system image (API 34 recommended)
  6. Finish setup

Running on Android Emulator

Running on Physical Device

  1. Enable Developer Options on your device
  2. Enable USB Debugging
  3. Connect device via USB
  4. Verify connection:
  5. Run app:

Troubleshooting Android

Build Fails

ADB Offline

Emulator Not Starting

Port Already in Use

macOS Desktop Development

Prerequisites

Same as iOS development requirements.

Running macOS App

Testing on All Platforms

Required: All changes must be tested on iOS, Android, Web, and mWeb before submitting a PR.

Testing Without Mac

If you don’t have a Mac, see TESTING_MACOS_AND_IOS.md for alternatives:
  • Cloud-based Mac services
  • MacinCloud
  • CI/CD preview builds

Testing Mobile Web (mWeb)

Use browser DevTools to simulate mobile:
  1. Open http://localhost:8080 in Chrome
  2. Open DevTools (F12)
  3. Click device toggle icon (Cmd+Shift+M / Ctrl+Shift+M)
  4. Select mobile device (e.g., iPhone 12 Pro)
  5. Test the app

IDE Setup

Settings

IntelliJ IDEA / WebStorm

  1. Settings > Languages & Frameworks > JavaScript > Prettier
  2. Check “On save”
  3. Set Prettier package: <project>/node_modules/prettier

Environment Variables

Common Variables

Creating .env is not recommended for external contributors. Variables can become outdated and cause errors.

Testing Specific Features

Development Workflow

1. Start Development Server

2. Make Changes

Edit files in src/. Changes will hot-reload automatically.

3. Run Code Quality Checks

4. Run Tests

5. Clean and Reset

If things aren’t working:

Debugging

React DevTools

Flipper

Flipper is installed automatically with React Native:
  1. Download Flipper Desktop
  2. Run app in development mode
  3. Flipper auto-detects the app
  4. View logs, network, layout, Onyx state, etc.

Chrome DevTools (Web)

  1. Open http://localhost:8080 in Chrome
  2. Open DevTools (F12)
  3. Debug like a normal web app

Safari DevTools (iOS)

  1. Enable Web Inspector on iOS device:
    • Settings > Safari > Advanced > Web Inspector
  2. Run app on device or simulator
  3. Open Safari on Mac > Develop > [Device] > [App]

Performance Testing

Reassure Performance Tests

See REASSURE_PERFORMANCE_TEST.md.

Common Issues

Metro Bundler Port Conflict

Node Version Mismatch

Pod Install Fails (iOS)

Gradle Sync Fails (Android)

Next Steps

Coding Standards

Learn the coding standards and best practices

Testing

Write and run tests

Pull Requests

Submit your first PR

Architecture

Understand the architecture

Additional Resources