[React Native] apk 개발 환경 구축하기(vscode에서)

React Native로 Android 앱을 개발하기 위한 기본 환경 설정 과정을 정리했습니다.
Mac 환경을 기준으로 작성되었습니다 :>

---

1. watchman 설치 (homebrew사용)

React Native는 파일 변경을 감지하기 위해 watchman 사용 (Homebrew로 간단히 설치 가능)

brew install watchman

watchman 설치

watchman —version

설치 후 확인 및 버전 체크

 

2. OpenJDK 설치

brew install openjdk@17

Android 빌드를 위해 JDK가 필요합니다! (React Native 최신 버전에서는 OpenJDK 17을 권장)

 

3. Android Studio 설치

공식 사이트에서 .dmg 설치 후, 안드로이드 SDK & AVD(에뮬레이터)도 함께 설정

 

4. 환경변수 설정하기 **

* Android SDK 경로를 환경변수에 추가해야 CLI 빌드 시 인식할 수 있음 ! *

# ~/.zshrc 또는 ~/.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

추가 후,

source ~/.zshrc

변경사항 저장!

 

5. React Native CLI 프로젝트 생성

노드 버전 안맞음..

=> 노드 업그레이드 후 다시 생성

 

TypeError: styleText is not a function

Node 버전이 올라가면서 기존 CLI (react-native 패키지 내부의 cli.js`)가 깨졌습니다.

해결방법 -> npx @react-native-community/cli init PTest

 

 

코코아팟 설치할거냐구 물어봄 -> no (ios개발할 때 필요함)

iOS 개발은 나중에 Xcode 설치 후 추가 설정 필요.

 

 

6. 프로젝트생성 완료 !

 

안드로이드 스튜디오에서 AVD 실행시켜놓고

 

 7. react native 앱을 에뮬레이터에 설치 및 실행!

Vscode 프로젝트 터미널에서

npx react-native run-android

 

---

현재까지는 개발용 apk!

개발 끝난 후 배포예정이라면,
+ 이후 학습내용 : <Release apk 생성하는 법> - "배포를 위해"