๐Ÿš€ Setting Up React Native (Expo Bare + TypeScript) Development Environment on macOS

If youโ€™re starting with React Native (Expo Bare + TypeScript) on macOS, you need a complete setup for Android and iOS development. This guide covers everything from installing prerequisites to running the app on simulators.

๐Ÿ‘‰ Reference Repo: rn-expo-t…


This content originally appeared on DEV Community and was authored by Dainy Jose

If youโ€™re starting with React Native (Expo Bare + TypeScript) on macOS, you need a complete setup for Android and iOS development. This guide covers everything from installing prerequisites to running the app on simulators.

๐Ÿ‘‰ Reference Repo: rn-expo-typescript-bare-template

๐Ÿ”ง System Setup

1. Install Homebrew

/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"

2. Install Node & NPM

brew install node

3. Install Git

brew install git

Set up your Git identity:
๐Ÿ‘‰ Git username and email setup

4. Install Watchman

brew install watchman

5. Install Java JDK (17)

brew install openjdk@17
sudo ln -sfn /opt/homebrew/opt/openjdk@17/libexec/openjdk.jdk /Library/Java/JavaVirtualMachines/openjdk-17.jdk

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

export JAVA_HOME=$(/usr/libexec/java_home -v17)
export PATH=$JAVA_HOME/bin:$PATH
source ~/.zshrc

6. Install CocoaPods (for iOS)

brew install cocoapods

7. Install Expo CLI

npm install -g expo-cli

8. Install VS Code

๐Ÿ‘‰ Download VS Code

๐Ÿ“ฑ Android & iOS Setup

Android Studio

๐Ÿ‘‰ Download Android Studio

sdk.dir=/Users/username/Library/Android/sdk

Xcode (for iOS)

๐Ÿ‘‰ Download Xcode

Switch versions if you maintain multiple Xcodes:

sudo xcode-select -s /Applications/Xcode.app/Contents/Developer
sudo xcode-select -s ~/Downloads/Xcode.app/Contents/Developer

Open .xcworkspace in Xcode to build for iOS.

๐Ÿ“‚ Project Setup

1. Clone the project:

git clone <your-repo-url>
cd rn-expo-typescript-bare-template

2. Install dependencies:

npm install

3. For react-native-snap-carousel issue, import ViewPropTypes manually:

import { ViewPropTypes } from 'deprecated-react-native-prop-types';

Update inside:

  • react-native-snap-carousel/src/carousel

  • pagination, paginationDot, parallaxImage

4. iOS setup:

cd ios
pod install
cd ..

5. Run the app:

npm run ios
npm run android

โœ… Wrap-Up

You now have a fully functional React Native (Expo Bare + TypeScript) setup on macOS ๐Ÿš€.
This covers Node, JDK, Android Studio, Xcode, Git, Expo CLI, Pods, VS Code, and extra dev tools.

๐Ÿ“Œ Reference Repo: rn-expo-typescript-bare-template

โœ๏ธ Written by Dainy Jose โ€” Mobile App Developer specialized in React Native and the MERN stack.

๐Ÿ’ผ Skills & Tools:

Mobile App Dev | MERN Stack | React Native | TypeScript | Redux | React.js | Node.js | MongoDB | MySQL | Express.js | REST API | JWT | Google Maps | Firebase | Jest | Agile | SDLC | Payments | Git | Bitbucket | Jira

๐Ÿ“ฌ Connect with me:

๐Ÿ”— LinkedIn

๐Ÿ’ป GitHub


This content originally appeared on DEV Community and was authored by Dainy Jose


Print Share Comment Cite Upload Translate Updates
APA

Dainy Jose | Sciencx (2025-09-22T06:00:51+00:00) ๐Ÿš€ Setting Up React Native (Expo Bare + TypeScript) Development Environment on macOS. Retrieved from https://www.scien.cx/2025/09/22/%f0%9f%9a%80-setting-up-react-native-expo-bare-typescript-development-environment-on-macos-2/

MLA
" » ๐Ÿš€ Setting Up React Native (Expo Bare + TypeScript) Development Environment on macOS." Dainy Jose | Sciencx - Monday September 22, 2025, https://www.scien.cx/2025/09/22/%f0%9f%9a%80-setting-up-react-native-expo-bare-typescript-development-environment-on-macos-2/
HARVARD
Dainy Jose | Sciencx Monday September 22, 2025 » ๐Ÿš€ Setting Up React Native (Expo Bare + TypeScript) Development Environment on macOS., viewed ,<https://www.scien.cx/2025/09/22/%f0%9f%9a%80-setting-up-react-native-expo-bare-typescript-development-environment-on-macos-2/>
VANCOUVER
Dainy Jose | Sciencx - » ๐Ÿš€ Setting Up React Native (Expo Bare + TypeScript) Development Environment on macOS. [Internet]. [Accessed ]. Available from: https://www.scien.cx/2025/09/22/%f0%9f%9a%80-setting-up-react-native-expo-bare-typescript-development-environment-on-macos-2/
CHICAGO
" » ๐Ÿš€ Setting Up React Native (Expo Bare + TypeScript) Development Environment on macOS." Dainy Jose | Sciencx - Accessed . https://www.scien.cx/2025/09/22/%f0%9f%9a%80-setting-up-react-native-expo-bare-typescript-development-environment-on-macos-2/
IEEE
" » ๐Ÿš€ Setting Up React Native (Expo Bare + TypeScript) Development Environment on macOS." Dainy Jose | Sciencx [Online]. Available: https://www.scien.cx/2025/09/22/%f0%9f%9a%80-setting-up-react-native-expo-bare-typescript-development-environment-on-macos-2/. [Accessed: ]
rf:citation
» ๐Ÿš€ Setting Up React Native (Expo Bare + TypeScript) Development Environment on macOS | Dainy Jose | Sciencx | https://www.scien.cx/2025/09/22/%f0%9f%9a%80-setting-up-react-native-expo-bare-typescript-development-environment-on-macos-2/ |

Please log in to upload a file.




There are no updates yet.
Click the Upload button above to add an update.

You must be logged in to translate posts. Please log in or register.