React-Native: 리액트네이티브 시작하기, 환경셋팅, npm, node, expo

환경셋팅

 

설치/버전 확인(특정 버전 이상만 가능)

node -v (10이상)

npm -v (6이상) -> 노드 설치하면 기본적으로 설치됨

xcode -> simulator가 필요

 

app store나 구글 플레이스토어에서

exop client 다운 => 핸드폰에서 테스트해볼 수 있는 유일한 방법

expo 설치

npm install -g expo-cli

 

왜 expo를 사용해야할까?

=> expo를 절대 사용하지 말라는 개발자도 많음(ㅠㅠ) -  상용 앱 개발시 어차피 네이티브 코드에서 다 다시 설정해줘야 하는 경우가 많음

=> 네이티브 파일 접근이 어려움(큰 기업에선 필요함)

=> 인스타그램, 우버 정도는 가능

 

Expo CLI

=> 네이티브 파일을 숨기고 모든걸 관리해줌. 

=> 휴대폰에서 앱을 테스트해볼 수 있음

=> 개발자 계정 필요없이~

=> 네이티브 파일을 크게 제어할 수 없는게 큰 문제임

=> expo는 create-react-app과 비슷함

 

 

프로젝트 만들기

 

expo init my-project

 

=> blank로 시작(처음해보는거니깐~)

 

 

 

깃 연동

 

git remote add origin 주소

git pull origin master

프라이빗 repository의 경우 SSH 설정 필요

 

app.json이 expo가 읽는것

 

 

시작

yarn start 

=> expo dev tool이 열림

=> 좌측 하단에셔 LAN은 같은 와이파이로 붙어있으면 연동됨

=> QR 코드로 안드/ios둘 다 에서 열어볼 수 있음

 

 

폰에서 테스트 하기

 

android => QR로 테스트가능

ios => expo 앱에서 가입을 하고 terminal에서 expo login해야함

=> 라이브로 반영됨

 

가끔 발생하는 오류는 로컬서버 재시작을 하면 해결됨 

 

 

리액트네이티브의 원리

1. 나는 리액트네이티브의 컴포넌트를 사용하고, 그 컴포넌트안에서는 브릿지라는 것으로 자바스크립코드롤 네이티브 코드로 연결시켜줌

Javascript와 Swift Code와 Java Code를 서로를 이해하기 위한 브릿지가 필수임

ex. 인스타그램, 데이팅 앱 등은 리액트 네이티브에 적합함 / 컨텐츠 위주. 폰카메라 등 네이티브 코드를 자주 건들거나 많은 데이터를 전송하는 류의 개발을 RN으로하는 것은 안좋음

 

리액트 네이티브는

span이런거 사용안함.

글을 사용하려면 view나 text만 사용해야함

 

 

 

 

 

 

 

Introduction to Expo - Expo Documentation