리액트 네이티브 개발환경 세팅 (Mac / RN CLI QuickStart)

시작하기앞서..

기본적인 설명은 https://facebook.github.io/react-native/docs/getting-started 에 있습니다.
저기 있는 설명과 개인적으로 밟았던 절차를 더한 글입니다.

Android

1. Dependencies (이미 설치된 것들이면 스킵 가능)

• 터미널에 필요한 것들을 깔아줍니다.
  brew install yarn
  brew install node
  brew install watchman
  brew tap AdoptOpenJDK/openjdk
  brew cask install adoptopenjdk8

• react native CLI 설치
  npm install -g react-native-cli

• Cannot find module 'npmlog' <- 이런 에러가뜨면 npm을 직접적으로 설치해보세요.

curl -0 -L https://npmjs.org/install.sh | sudo sh.

2. 안드로이드 개발환경

• 안드로이드 스튜디오 설치 (https://developer.android.com/studio/index.html)
  안드로이드를 설치할때 Custom을 선택해서 밑에 4개가 다 깔리도록 체크하세요.

  • Android SDK
  • Android SDK Platform
  • Performance (Intel ® HAXM)
  • Android Virtual Device

• 안드로이드 SDK 설치
  설치 후 안드로이드 스튜디오 실행 시 이 화면이 뜹니다.
  
  Configure -> SDK Manager를 들어갑니다.
  SDK Platform 탭을 선택하고 Show Package Details를 체크해줍니다.
  SDK Tool 탭을 선택하고 Show Package Details를 체크해줍니다.
  -Android SDK Platform 28
  -Intel x86 Atom_64 System Image or Google APIs Intel x86 Atom System Image
  이 2개를 체크해줍니다.

  SDK Tool 탭을 선택하고 Show Package Details를 체크해줍니다.
  -Android SDK Build-Tools 하위버전에 28.0.3을 체크해줍니다.

  Apply를 누르고 설치를 하면 됩니다.
  (각자가 쓸 안드로이드에 대해 다른걸 설치해야 할 것 같은데..? 이건 좀더 알아봐야함..)
  

• ANDROID_HOME 환경변수 설정
  $HOME/.bash_profile 이나 $HOME/.bashrc 설정파일에 밑의 줄을 추가합니다.
  (bash를 쓰는 경우 bashrc, bash_profile이 있음. 다른 명령창을 쓰면 알맞는 설정파일에 넣으세요.)

  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

  source $HOME/.bash_profile 을 통해 현재 쉘에 설정을 적용합니다.
  echo $PATH를 하여 적용이 잘 되었는지 확인합니다.

  react-native run-android
  가상머신에 프로젝트 실행됨

iOS

1. Dependencies (이미 설치된 것들이면 스킵 가능)

• 터미널에 필요한 것들을 깔아줍니다.
  brew install node
  brew install watchman

• react native CLI 설치
  npm install -g react-native-cli

• Cannot find module 'npmlog' <- 이런 에러가뜨면 npm을 직접적으로 설치해보세요.

curl -0 -L https://npmjs.org/install.sh | sudo sh.

2. iOS 개발 환경

• Xcode
  Mac App Store 에 가서 Xcode를 설치하세요. 시간이 꽤 걸립니다. 커피 한잔 하고오세요 ㅎ..
  
• Xcode Command Line Tools 설치
  Preferences -> Locations 탭에서 Command Line Tools 가장 최신버전을 설치합니다.
  
• Cocoapods 설치
  sudo gem install cocoapods
  

xcode에서 프로젝트를 열때 저희는 cocoapods를 사용하고 있기때문에 ios폴더안에서 .xcworkspace 파일을 열어야합니다.
밑은 프로젝트를 열었을때의 화면인데 파란네모에서 대상 기기를 선택하고 재생(?) 버튼을 누르면 빌드가 시작됩니다.

여기서 한번 겪었던 "문제가 팀이 할당되어있지 않다"(?) 라는 오류가 발생했습니다.
Preference 들어가서 Accounts에서 AppleID 추가를 하고나서 빨간네모 클릭하면 위 화면처럼 세팅창이 나오는데 Signing & Capabilities 쪽에서 아까 추가했던 팀을 선택할 수 있습니다.

https://stackoverflow.com/questions/48890569/requires-a-development-team-select-a-development-team-in-the-project-editor
https://stackoverflow.com/questions/44160993/xcode-error-the-app-id-cannot-be-registered-to-your-development-team
위 문제 관련해서 참고해보시길바랍니다.