[RN공부하기] [1]expo로 시작하기

https://reactnative.dev/docs/environment-setup

Setting up the development environment · React Native

rn공식 사이트와

https://docs.expo.dev/

Introduction to Expo - Expo Documentation

expo사이트를 참고함.

 

 

 

여느때와 마찬가지로 먼저 git레포를 먼저 생성한다음에 Sourcetree와 연동해준다.

(1)

README파일은 자동 추가로 한다. 왜냐면 그게 git clone할때 버그가 안생김.

 

(2)

SourceTree를 이용해서 레포 로컬에 git clone하기.

 

(3)

expo-cli를 글로벌로 설치

npm install -g expo-cli

expo init AwesomeProject

cd AwesomeProject
npm start # you can also use: expo start

 

( 설치중 오류 )

vscode 터미널로 설치시 권한오류가 떠서 cmd 관리자 권한으로 expo init 프로젝트명 으로 설치했다.

- 선택에서는 제일 위 blank를 선택함.

 

(4) 설치 완료후 구조

(5) cd 명령어로 프로젝트 이동 후 yarn명령어로 start하기

 

vscode에서 쓰고 싶어서 vscode로 가서 npm start하니까

 

 

??? vscode에 가서 npm start로 실행시키니까 바로 git연동이 끊어짐... 왜..?

:: 이유는 expo init 프로젝트로 만들었을때 자동으로 git이 생성된다. 이미 git clone한 프로젝트에서 git이 다시 생성되서 연결이 끊어짐.

해결방법) 먼저 expo 프로젝트를 만들고 start한다음에 github 레포를 만들어서 터미널로 git remote를 이용해서 원격지와 연결해준다. 해결!!!!

(6) expo build툴? 나옴

 

(7) google스토어나 app스토어에서 expo 검색후 앱을 다운받아 위 사진에 qr코드를 찍는다.

-- 앱다운 안됨 --

앱에서 QR 코드 스캔
앱에서 실행이 안될 경우
컴퓨터 와이파이와 앱 실행 중인 기기의 와이파이가 동일한지 확인
와이파이가 동일한데 안되는 경우, Tunnel/LAN/Local 모두 테스트해보면서 되는 환경 찾기-> 안되는 이유는 방화벽, 네트워크 환경 등으로 다양하다.

 

(8) expo먼저 가입하자.

https://expo.io/signup

Sign Up — Expo

 

(9) 로컬 pc와 휴대폰 Wifi가 일치 해야지만 expo앱에서 다운 받을 수 있어서 일딴 Run in web browser를 이용해서 출력하자.