These instructions assume that you've already used to the developer-setup repo to install:
- chruby and ruby-install for managing ruby versions
- The correct version of Ruby (2.6.10)
chruby ruby-2.6.10
- The correct version of Node (20.5.0)
- nvm for managing node versions
- Yarn 1 for installing node packages
- Pre-commit for configuring pre-commit hooks
-
Set up the pre-commit hooks for this repo:
pre-commit install
-
Create your
.env
file from the template:cp .env.example .env
-
React Native server requires Watchman to determine which files have changed:
brew install watchman
-
Ensure that you have the Zulu11 installed
brew tap homebrew/cask-versions brew install --cask zulu11
-
Install Android Studio
brew install android-studio
-
Add required environment variables (refer to the React Native setup guide for more details)
export JAVA_HOME=$(/usr/libexec/java_home -v 11) export ANDROID_HOME=$HOME/Library/Android/sdk export PATH=$PATH:$ANDROID_HOME/cmdline-tools/latest/bin export PATH=$PATH:$ANDROID_HOME/emulator export PATH=$PATH:$ANDROID_HOME/tools export PATH=$PATH:$ANDROID_HOME/tools/bin export PATH=$PATH:$ANDROID_HOME/platform-tools
for Android Studio versions before Giraffe (2022.3.1):
export JAVA_HOME="/Applications/Android Studio.app/Contents/jre/jdk/Contents/Home"
-
Open Android Studio
-
Using the SDK Manager install:
- Android 13 (R) SDK (API Level 33)
- Android SDK Command-Line Tools (30.0.0)
- Android SDK Build-Tools
- Android SDK Platform-Tools
- Android Emulator
-
Create the Android emulator that'll be used to run our Detox tests
yarn android:emulator:create
-
Ensure you have a recent version of Ruby available globally. You should be able to use a package manager such as chruby as long as Ruby is loaded in
.zshrc/.bashrc
. -
Install Xcode from the Mac App Store
-
Ensure that your machine is configured to use the full version of Xcode by default (as opposed to just the command-line tools as these aren't sufficient for React Native):
sudo xcode-select --switch /Applications/Xcode.app
-
Install all node dependencies:
yarn install
-
Install Ruby gems:
cd ios bundle install
-
Install iOS dependencies:
npx pod-install ios
-
Start the React Native Metro server and the GraphQL code generator:
yarn dev
(Alternatively, start the two processes in separate terminals using
yarn start
andyarn codegen:watch
) -
To run the app on the default iOS simulator:
yarn ios
See also: Running the app on a physical iOS device
-
To run the app on the Android emulator (or any other Android device connected to the Android Debug Bridge):
yarn android yarn android:adb_reverse # only required when running against localhost
yarn jest
-
Ensure that you've created the emulator (see setting up the Android dev environment)
-
Start emulator if it isn't already running:
yarn android:emulator:boot yarn android:adb_reverse
-
Start the React Native Metro server:
yarn start
-
Run the Detox build:
yarn detox:android:debug:build
-
Run the tests:
yarn detox:android:debug:run
After making changes to the app, you can usually rerun the tests without repeating the Detox build step
-
Install applesimutils:
brew tap wix/brew brew install applesimutils
-
Ensure that you have the iOS 15.2 Simulators installed:
-
Open Xcode
-
From the Xcode menu, select Preferences > Components > Simulators
-
Click the Download icon next to 'iOS 15.2 Simulator'
-
-
Ensure that Pods are in sync:
npx pod-install ios
-
Run the Detox build:
yarn detox:ios:debug:build
-
Run the tests:
yarn detox:ios:debug:run
After making changes to the app, you can usually rerun the tests without repeating the Detox build step
-
Have the
MATCH_PASSWORD
from the Mobile App vault in 1Password ready -
Download the development profile (you'll be prompted for the
MATCH_PASSWORD
)cd ios bundle install bundle exec fastlane development_download_credentials
-
Find the UDID of the device:
xcrun xctrace list devices
-
Register the device with our Apple Developer account
-
Ask someone with the Admin role for our Apple Developer account to regenerate the development profile
We may need to regenerate our development profile from time to time, for example after we have registered a new test device. You'll need someone with the Admin role in our Apple Developer account to complete this operation.
-
Have the MATCH_PASSWORD from the Mobile App vault in 1Password ready
-
Have your Apple ID credentials (one with the Admin role in our Apple Developer account) ready
-
Nuke and regenerate the development profile:
cd ios bundle exec fastlane development_regenerate_credentials
-
Ensure that you have installed the iOS development profile
-
Ensure the the device has been registered for testing
-
Install the
ios-deploy
tool:brew install ios-deploy
-
Update your
.env
to use your current IP instead of localhost (e.g.GRAPHQL_API_URL=http://192.164.0.23:3000/graphql
) and run the Rails server usingbin/rails s -b 0.0.0.0
to listen on all network interfaces. -
Run the app:
yarn ios --device
-
Build the release package:
cd android ./gradlew assembleRelease
If you see 'Unable to extract native debug metadata from...' errors in the build output, you may need to install the version of the Android NDK specified in
android/build.gradle
before trying again. -
Ensure that you have a device connected to the Android Debug Bridge
-
Install the release package on the device:
adb -d install app/build/outputs/apk/beta/release/app-beta-release.apk
-
Build the release app:
yarn ios --device --configuration Release
This will build and install the iOS (release build) on your iOS device
-
Add the query to a
gql
file (e.g.src/screens/SignInScreen/UserAuthenticateMutation.gql
) -
If you're already running the GraphQL code generator watcher via
yarn dev
oryarn codegen:watch
, this will detect the new file and automatically generate a TypeScript file defining the associated React hooks (e.g.UserAuthenticateMutation.generated.tsx
).If you are not the GraphQL code generator watcher you will need to run the code generator manually:
yarn codegen:main