Dev/RN

1. RN 환경설정하기

VIPeveloper 2021. 1. 17. 17:38
728x90
반응형

nvm

격리 시키는 역할

gist.github.com/falsy/8aa42ae311a9adb50e2ca7d8702c9af1

 

NVM(Node Version Manager) 맥OS에서 설치 & 사용하기

NVM(Node Version Manager) 맥OS에서 설치 & 사용하기. GitHub Gist: instantly share code, notes, and snippets.

gist.github.com

1. 설치

sudo curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.33.11/install.sh | bash

2. 확인

vi ~/.bash_profile

접속 후

export NVM_DIR="$HOME/.nvm"
[ -s "$NVM_DIR/nvm.sh" ] && . "$NVM_DIR/nvm.sh" # This loads nvm

코드 넣기

3. 재시작

source ~/.bash_profile

4. 확인

nvm ls


node.js

nvm이 원하는 조건에 따라 복수 설치하는 방법. 

1. 설치

nvm install 10.15.1

2. 확인

node -v

3. 버전 확정

nvm use 10.15.1

npm

node.js 로 작성된 프로그램을 편리하게 설치 업데이트 삭제해주는 프로그램. 패키지 관리 프로그램. node.js 설치 시 자동 설치된다.

1. 확인

npm --version

중간 정리

node.js version == 10.15.1

npm version == 6.13.7

 

 

 

 

android studio

toolbox에서 설치해도 되고, 공홈가서 설치해도 됨.

해당 창에서 SDK Manager 들어간다.

2. 설치가 완료되었다면 android q 버전을 설치해준다.

안드로이드는 사진이 많네..

 

3. configure AVD Manager 들어가서 가상 모바일 폰 하나 생성해줍니다.

 

4. 터미널에서 

vi ~/.bash_profile

맨 위에

export ANDROID_HOME=/Users/yudong-gwan/Library/Android/sdk <-- android sdk location
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

넣어준다. 첫번째 줄은 위 사진의 android sdk location과 경로를 일치시켜주어야 한다.

 

5. 확인

adb

이런식으로 나오면 성공!

 

 

 

java

jdk를 설치해보자

 

오라클에서 설치하고, 11 버전을 다운로드 받아준다.

java --version

저는 15 버전을 사용하고 있었기 때문에 여기 를 참고해서 자바 버전을 변경해줍니다.

 

 

xcode

app store 에서 설치해야한다.

좌측 상단 -> xcode - preference - locations 클릭

command line tools 가 xcode11.3.1 로 설정되어있다면 된다.

 

visual studio code

여기에서 1.42 버전을 다운받자. 최신 버전 받고싶다고? 알 수 없는 에러에 허덕이고있는 당신을 마주하게 된다..

설치는 쉬우니 응용프로그램으로 드래그해서 옮겨주자.

 

cocoaPod

sudo gem install cocoapods -v 1.8.4

RN은 버전 관리가 정말 중요한 것 같다... 버전이 조금만 틀어져도 실행 자체가 안된다.

혹시나 최신 버전이 깔려있는지 확인하려면

pod --version

최신 깔린 버전을 지우려면

sudo gem uninstall cocoapods -v1.10.1

을 이용하자.

 

 

 

React Native CLI

npm install -g react-native-cli

확인

react-native --version

2.0.1 이거 뜨면 성공임

 

환경설정을 위한 모든 준비가 끝났습니다.

728x90
반응형

'Dev > RN' 카테고리의 다른 글

6. [RN] state, props를 이용해 데이터 전달하기  (0) 2021.01.28
5. [RN] 조각 붙이기  (0) 2021.01.27
4. [RN] 스타일 꾸미기  (0) 2021.01.26
3. [RN] Hello world! 띄우기  (0) 2021.01.25
2. [RN] 프로젝트 만들기  (0) 2021.01.23