[MAC] React-Native 설치

🔑 시작하기 앞서...

1️⃣ Homebrew 설치

: 자세한 사항은 MAcOS 개발환경 셋팅에서 확인하면 된다.

2️⃣ Node.js 설치

1. Node.js 설치한다.
   1-1. Node.js에서 다운로드한다.
   1-2. 터미널창에 brew install node 입력 후 설치한다.
2. node --version

3️⃣ Whatchman 설치

1. brew install watchman
   

---

🔑 react-native 개발 환경 선택

1️⃣ Expo CLI 사용

1. npm install --global expo-cli
2. npx create-expo-app 프로젝트명
3. Expo Go 애플리케이션 아이폰이나 아이패드에 다운로드 한다.
   
4. npx expo login
5. npx expo start

2️⃣ React-Native CLI 사용

1. React Native CLI 설치한다.

   npm install -g react-native-cli
   react-native --version

   
2. App store에서 Xcode 다운로드한다.
   
3. rbenv 설치한다.

   brew install rbenv
   rbenv install 3.0.2
   rbenv global 3.0.2
   rbenv versions

   
4. Cocoapods 설치한다.

   sudo gem install cocoapods
   pod --version

   
5. JDK 설치한다.
   5-1. oracle에서 java 설치한다.
   ✔️ 지원되는 버전인 17~20 사이의 버전을 설치해야 한다.
   5-2. JAVA_HOME 환경 변수를 추가한다.

   export JAVA_HOME=$(/usr/libexec/java_home -v 17)
   echo 'export JAVA_HOME=$(/usr/libexec/java_home -v 17)' >> ~/.zshrc

   5-3. source ~/.zshrc
   5-4. java -version
   
6. 안드로이드 스튜디오 설치한다.
   6-1. androidstudio에서 다운로드한다.
   6-2. Android adb, sdk 환경변수를 추가한다.

   echo 'export ANDROID_HOME=$HOME/Library/Android/sdk' >> ~/.zshrc
   echo 'export PATH=$PATH:$ANDROID_HOME/emulator' >> ~/.zshrc
   echo 'export PATH=$PATH:$ANDROID_HOME/tools' >> ~/.zshrc
   echo 'export PATH=$PATH:$ANDROID_HOME/tools/bin' >> ~/.zshrc
   echo 'export PATH=$PATH:$ANDROID_HOME/platform-tools' >> ~/.zshrc

   6-3. source ~/.zshrc

7. 지금까지 환경설정 점검한다.

   npx @react-native-community/cli doctor

   

8. 프로젝트를 생성한다.

   npx react-native init 프로젝트명

   

9. 프로젝트를 실행한다.
   9-1. cd 프로젝트명
   9-2. npm run ios
   9-3. npm run android