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
http://localhost:8080.
External Contributors
Set this environment variable to avoid CORS errors:Troubleshooting Web
CORS Errors
.env file or set USE_WEB_PROXY=true.
Port Already in Use
iOS Development
macOS only: iOS development requires macOS and Xcode.
Prerequisites
- Xcode: Install from App Store (latest stable version)
- Xcode Command Line Tools:
- 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
-
Java Development Kit (JDK)
-
Android Studio
- Download from developer.android.com
- Install with default settings
- Open Android Studio and complete initial setup
-
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:
Create Android Virtual Device (AVD)
- Open Android Studio
- Tools > Device Manager
- Create Virtual Device
- Select a device (e.g., Pixel 6)
- Select system image (API 34 recommended)
- Finish setup
Running on Android Emulator
Running on Physical Device
- Enable Developer Options on your device
- Enable USB Debugging
- Connect device via USB
- Verify connection:
- 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
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:- Open
http://localhost:8080in Chrome - Open DevTools (F12)
- Click device toggle icon (Cmd+Shift+M / Ctrl+Shift+M)
- Select mobile device (e.g., iPhone 12 Pro)
- Test the app
IDE Setup
Visual Studio Code (Recommended)
Recommended Extensions
Settings
IntelliJ IDEA / WebStorm
- Settings > Languages & Frameworks > JavaScript > Prettier
- Check “On save”
- Set Prettier package:
<project>/node_modules/prettier
Environment Variables
Common Variables
Testing Specific Features
Development Workflow
1. Start Development Server
2. Make Changes
Edit files insrc/. 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:- Download Flipper Desktop
- Run app in development mode
- Flipper auto-detects the app
- View logs, network, layout, Onyx state, etc.
Chrome DevTools (Web)
- Open
http://localhost:8080in Chrome - Open DevTools (F12)
- Debug like a normal web app
Safari DevTools (iOS)
- Enable Web Inspector on iOS device:
- Settings > Safari > Advanced > Web Inspector
- Run app on device or simulator
- Open Safari on Mac > Develop > [Device] > [App]
Performance Testing
Reassure Performance Tests
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
