Setup Mac M1 Silicon for ReactNative Development

Eric Bishard - Nov 5 - - Dev Community

Set NVM to 18: 

nvm install 18 
nvm use 18
Enter fullscreen mode Exit fullscreen mode

Install Watchman with Brew 

brew install watchman
Enter fullscreen mode Exit fullscreen mode

Ruby Setup

*Install rbenv for Ruby version management *

brew install rbenv
Enter fullscreen mode Exit fullscreen mode

*Set up rbenv in your shell *

rbenv init
Enter fullscreen mode Exit fullscreen mode

*Install Ruby 2.7.6 (recommended for React Native) *

rbenv install 2.7.6 rbenv global 2.7.6
Enter fullscreen mode Exit fullscreen mode

*Verify Ruby version *

ruby -v
Enter fullscreen mode Exit fullscreen mode

Install Xcode

From Apple Store

[✓] macOS 16.1 (built-in)
[✓] iOS 18.1

Manually Install Xcode iOS Simulator:

  1. Open Xcode
  2. Xcode → Preferences → Components
  3. Download a simulator (iOS 16+ recommended)

Install Xcode command line should now be installed? If not: 

xcode-select --install
Enter fullscreen mode Exit fullscreen mode

You can run several commands to verify your Xcode setup:
First, check that Xcode command line tools are installed:

xcode-select --version
Enter fullscreen mode Exit fullscreen mode

Verify Xcode's location:

xcode-select -p
Enter fullscreen mode Exit fullscreen mode

Should typically show /Applications/Xcode.app/Contents/Developer

Check the full Xcode version:

xcodebuild -version
Enter fullscreen mode Exit fullscreen mode

Verify iOS simulator is installed:

xcrun simctl list devices
Enter fullscreen mode Exit fullscreen mode

This should show you a list of available iOS simulators.
If any of these commands fail, you might need to:

Accept Xcode license:

sudo xcodebuild -license accept
Enter fullscreen mode Exit fullscreen mode

Or reinstall command line tools:

xcode-select --install
Enter fullscreen mode Exit fullscreen mode

Install CocoaPods 

sudo gem install cocoapods
Enter fullscreen mode Exit fullscreen mode

If CocoaPods doesn't install because there's a Ruby version conflict. Maybe you're running Ruby 2.6.10, but you need at least Ruby 2.7.0.
Here's how to fix this:

Install a newer version of Ruby using Homebrew:

brew install ruby
Enter fullscreen mode Exit fullscreen mode

Add the new Ruby to your PATH in your .zshrc file:

echo 'export PATH="/opt/homebrew/opt/ruby/bin:$PATH"' >> ~/.zshrc 
source ~/.zshrc
Enter fullscreen mode Exit fullscreen mode

Verify you have the new Ruby version:

ruby -v
Enter fullscreen mode Exit fullscreen mode

(Should show a version >= 2.7.0)

Try installing Cocoapods again:

sudo gem install cocoapods
Enter fullscreen mode Exit fullscreen mode

After installation, verify Cocoapods is installed:

pod --version
Enter fullscreen mode Exit fullscreen mode

A lot can go wrong at this juncture, I suggest if you have any issues, using Claude or ChatGPT to troubleshoot and don't move on until you can see all versions installed from your terminal and all paths are correct in your .zshrc etc...

Install Android Studio: 

brew install --cask android-studio
Enter fullscreen mode Exit fullscreen mode

Android Studio Setup:

  • Open Android Studio
  • Complete initial setup wizard (Choose Custom)
  • Install Android SDK (via Tools → SDK Manager):
    • Android SDK Platform 14 (API 34)
    • Intel x86 Atom_64 System Image or Google APIs Intel x86 Atom System Image
    • Android SDK Build-Tools
    • NDK (Side by side)
    • CMake

Configure Environment Variables:

Add to your ~/.zshrc or ~/.bash_profile:

export ANDROID_HOME=$HOME/Library/Android/sdk
export PATH=$PATH:$ANDROID_HOME/emulator
export PATH=$PATH:$ANDROID_HOME/platform-tools
export PATH=$PATH:$ANDROID_HOME/tools
export PATH=$PATH:$ANDROID_HOME/tools/bin
Enter fullscreen mode Exit fullscreen mode

Create Android Virtual Device (AVD):

  • Open Android Studio
  • Tools → AVD Manager
  • Create Virtual Device
  • Select a device definition (e.g., Pixel 4)
  • Select a system image (API 35 recommended)

Install Java Runtime

For M1 Macs, you'll need to install the ARM64 version of the JDK (Java Development Kit). The simplest way to install it is:

brew tap homebrew/cask-versions
brew install --cask zulu17
Enter fullscreen mode Exit fullscreen mode

This will install Azul Zulu JDK 17, which is compatible with Android Studio and React Native development on M1 Macs. To verify the installation:

java -version
javac --version
Enter fullscreen mode Exit fullscreen mode

This will give you OpenJDK 17, which works well with Android development on M1 Macs.

Verification Steps

Install React Native CLI?

The react-native-cli global package is actually deprecated. Instead, you should use @react-native-community/cli which comes bundled with the npx command.

If already installed, you can safely uninstall the global CLI:

npm uninstall -g react-native-cli
Enter fullscreen mode Exit fullscreen mode

And instead, when creating new projects, use:

npx react-native init ProjectName
Enter fullscreen mode Exit fullscreen mode

This approach is preferred because:

  • It ensures you always use the latest version of the CLI
  • Avoids global package installations
  • Prevents version conflicts

Create a test project:

npx react-native init TestProject --template react-native-template-typescript
cd TestProject
Enter fullscreen mode Exit fullscreen mode

Test iOS setup:

cd ios && pod install && cd ..
npx react-native run-ios
Enter fullscreen mode Exit fullscreen mode

Test Android setup:

# Start Android emulator first
npx react-native run-android
Enter fullscreen mode Exit fullscreen mode

Troubleshooting

If you encounter M1-specific issues:

For iOS: Try adding this to your Podfile:

post_install do |installer|
  installer.pods_project.targets.each do |target|
    target.build_configurations.each do |config|
      config.build_settings['EXCLUDED_ARCHS[sdk=iphonesimulator*]'] = "arm64"
    end
  end
end
Enter fullscreen mode Exit fullscreen mode

For Android: Ensure you're using the ARM64 system image when creating AVD

Image
Weekly Indie Log #20

weeklyindielog
Image
Leveraging Shopify SOCKS5 Proxies for Success

shopifysocks5proxies, shopify
Image
15 Secretly Funny People In Crypto Coin Casino
Image
Build Inventory Software [Rust / Cursive]

rust, programming, newbie, terminal
Image
How to Train Your Cat to Use a Cat Flap
Image
The Benefits of Using Tamilyogi with Proxy Servers

tamilyogi, proxy
Image
10 Asbestos Payout Tricks All Experts Recommend
Image
5 Clarifications Regarding Wheelchair Self Propelled Folding
Image
Don't Make This Silly Mistake When It Comes To Your Spare Car Key Cut
Image
Menelusuri Dunia Slot: Keberuntungan dan Strategi Menang
Image
5 Common Phrases About Spare Keys You Should Stay Clear Of
Image
TypeScript : Utility Types

typescript, util, javascript
Image
Native Domain-Driven Design with Flama

flama, api, python, machinelearning
Image
Cat Flap Installation Cost
Image
20 Truths About Asbestos Claims Payout: Busted
Image
Zonnepanelen in Emmen: Bespaar op energiekosten & versterk duurzaamheid
Image
MySQL Daemon Overview and Tools

daemon, mysql
Image
Coolify: server management the cool way

opensource, cicd, systems
Image
7 Essential Tips For Making The Most Out Of Your Spare Car Keys Cost
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .