MAC OS: 10.15.6 (Catalina)
Pre-install
// Install Homebrew ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/uninstall)" // Install Node.js and npm brew install node node --version // my output: v14.9.0 // Install watchman brew install watchman // Install Java JRE and JDK brew tap AdoptOpenJDK/openjdk brew cask install adoptopenjdk8 // Install React Native npm install -g react-native-cli
Set up Xcode
Download Xcode via Mac App Store
- Open Xcode, Xcode > Preferences
- Goto the Locations tab
- Selecting the most recent version from the Command Line Tools dropdown
- Install cocoapods to MAC OS
gem install cocoapods
Set up Android Studio
Download Android Studio from here
- Open Android Studio
- Goto the Configure > SDK Manager
- By default, it’s Appearance & Behavior → System Settings → Android SDK and check ✅ the box of latest version from Hide Obsolete Packages.
- Also check ✅ the boxes of below in Show package details,
- Android SDK Platform 29 or 30
- Google APIs Intel x86 Atom System Image
- Click “Apply” to download and install the Android SDK and related build tools.
- Set up environment variables to getting start with native code, Open terminal
cd ~/ touch ~/.bash_profile; open -e .bash_profile
and paste below lines there
export ANDROID_HOME=$HOME/Library/Android/sdk export ANDROID_HOME=$HOME/Library/Android/sdk 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
save and do not forget to trigger the change
source ~/.bash_profile
Then you can create new Android Virtual Device (AVD) to run the application.
- Open Android Studio
- Goto the Configure > AVD Manager
- Create Virtual Device > pick any Phone from the list and click “Next”,
Click “Next” then “Finish” to create your AVD. At this point you should be able to click on the green triangle button next to your AVD to launch it , then proceed to the next step.
Create First React Native App
cd Documents react-native init firstApp
Running
cd first-app react-native run-ios react-native run-android
The first time when you run this code you might get a build failed errors as,
cd android nano local.properties
sdk.dir = /Users/pabasara/Library/Android/sdk
cd ~/Library/Android/sdk/tools/bin/ ./sdkmanager --licenses
Create First React Native App
cd Documents expo init firstExpo cd firstExpo expo start
the latest sdk version is 39
Sources from many websites, major in https://medium.com/@pabasarajayawardhana/react-native-environment-set-up-on-mac-os-with-xcode-and-android-studio-324e64c8552e