[React Native] MacOS 개발 환경 설정 하기.

맥에서 React Native를 개발하기 위한 개발 환경 설정하는 방법을 정리해 보도록 하겠습니다.

 

1. 홈브루 설치

 

홈브루는 맥에서 패키지를 설치하고 관리하는 맥용 패키지 관리자 입니다. 다양한 패키지를 간단하게 명령어로 설치 가능합니다.

홈브루를 만약에 설치 하셨다면 아래 명령어로 설치 되었는지 다시 한번 확인 합니다.

 

버전 확인

brew --version

Homebrew 2.2.11
Homebrew/homebrew-core (git revision b237e6; last commit 2020-04-05)
Homebrew/homebrew-cask (git revision a5780; last commit 2020-04-05)

 

만약 버전 표시가 되지 않거 알수 없는 명령어로 표시 된다면 아래 사이트에서 홈브루를 설치 합니다.

 

홈브루 설치 사이트 : https://brew.sh/ 

Homebrew

간단하게 brew 홈페이지에 있는 Install 명령어를 실행하면 설치 가능합니다.

 

설치 명령어

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

 

설치 완료 후 위에서 했던 버전 확인을 진행합니다.

자 이제 React Native를 개발하기 위한 패키지들을 설치 합니다.

 

2. node 설치 하기.

 

node는 brew로 설치 가능하지만 저는 nvm을 활용하는 것을 추천 드립니다.

nvm을 통해 설치하는 방법은 아래 포스팅을 확인하세요.

 

https://firework-ham.tistory.com/20

[node] nvm 설치하기, node, npm 설치하기.

brew로 설치하고 싶으시다면 다음을 따라하여 설치하세요.

 

터미널을 열고 아래 명령어를 실행합니다.

brew install node

node, npm 버전을 확인하여 설치 되었는지 확인합니다,

node --version

npm --version

 

3. 왓치맨 설치

 

  왓치맨은 특정 디렉토리나 파일을 감시해 변경이 발생하면 특정 동작을 실행하도록 합니다. react-native의 소스코드 변경이 발생하면 재로딩 하기 위해서 왓치맨을 사용합니다.

 

  아래 명령어를 통해 왓치맨을 설치합니다.

brew install watchman

 

왓치맨도 버전을 확인합니다.

watchman --version

 

4. 리엑트 네이티브 CLI 설치

 

  리엑트 네이티브로 개발할 때 공식 홈페이지에서는 expo cli와 react-natvie cli 두 가지 방법을 제시합니다. 저는 react-native cli를 추천하는데 그 이유는 expo의 단점이 명확하기 때문입니다.

  

  expo cli를 사용하면 필요 하지 않는 라이브러리를 설치해야 하기 때문에 프로젝트 사이즈가 커지고 expo cli에서 제공하지 않는 부분은 사용하기 어렵거나 사용하려고 해도 여러 과정을 거쳐야 하기 때문에 어렵습니다.

 

그래서 리엑트 네이티브 CLI를 많은 분들이 추천하고 저도 추천합니다.

 

다음 명령어를 통해 설치합니다.

npm install -g react-native-cli

 

5. Xcode 설치

 

Xcode는 iOS 앱을 만들기 위해 필수적으로 설치 해야 합니다.

App Store에서 Xcode를 검색하여 설치 합니다. 용량이 크기 때문에 설치하는데 시간이 어느 정도 걸리니 참고하세요.

 

Xcode가 설치 되었다면 Command Line Tool을 설치해야 합니다.

Xcode를 설치 하고 아래 경로를 따라 가서 Command Line Tool이 설정 되었는지 확인 합니다.

 

Xcode > Preferences > Locations > Command Line Tools

 

6. 코코아포드 설치

 

코코아포드는 iOS 개발에 사용되는 의존성 관리자 입니다. 개발에 필요한 라이브러리를 설치하거나 관리할 때 사용되므로 아래 명령어를 실행하여 설치 합니다.

 

sudo gem install cocoapods

 설치가 완료 되면 아래 명령어로 설치를 확인합니다.

pod --version

 

7. Java 설치

 

만약 자바가 설치 되어 있지 않다면 아래 명령어를 활용하여 자바를 설치합니다.

brew tap AdoptOpenJDK/openjdk

brew cask install adoptopenjdk8

자바 버전을 확인하여 설치를 확인합니다.

java -version

만약, Unkown command : cask 가 뜬다면 아래 명령어를 활용하여 설치하자.

brew install --cask adoptopenjdk8

 

 

8. 안드로이드 스튜디오 

 

만약, iOS와 안드로이드를 모두 테스트 해보고 싶다면 안드로이드 스튜디오를 설치 합니다.

 

https://developer.android.com/studio

Download Android Studio and SDK tools  |  Android 스튜디오

다운로드 후 실행하여 아래 화면이 뜨면 Application 방향으로 안드로이드 스튜디오 아이콘을 옮겨 설치합니다.

 

그리고 런처 패드에 등록된 안드로이드 스튜디오를 실행합니다.

실행 한뒤 Next를 눌러 넘어간뒤 아래 화면이 나오면 "Custom"으로 변경하고 넘어갑니다.

Android Virtual Device 옵션도 선택하여 설치 합니다.

나머지는 Next 후 완료 하여 설치를 진행합니다.

 

안드로이드 스튜디오 실행 한뒤 Configure > SDK Manager를 실행 한뒤 Android 9.0 (pie)를 추가로 설치합니다.

 

설치가 완료되면 안드로이드 path을 설정합니다.

export ANDROID_HOME=<설치된 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

터미널에서 아래 명령어가 먹히면 성공

adb