React native 터미널 환경세팅

coilly·2022년 3월 13일
0

터미널 환경세팅

  • React Native CLI
npx react-native init FirstRN //줄여서 RNI
npx react-native start
npx react-native run-ios //ios 시작
npx react-native run-android //android 시작
cd ios > npx pod install //install or update

XCode나 Android Studio가 필요(실시간으로 수정하면 바로 볼수 있는 프로그램),

X code로 시뮬레이터가 실행된다. 장점은 필요한 기능이 있는 경우, 모듈을 직접만들어 사용할 수 있다.

단점 초기 구성이 오래걸리고 배포하기 불편하다.

(CocoaPods - ios 프로젝트 제작시 필요)

//폴더 구성

ㄴ android 
	 ㄴ gradle //안드로이드 시스템에서 빌드 관리
	 ㄴ gradlew //gradlewrapper
	 ㄴ build.gradle //빌드 설정
	 ....

ㄴ ios
	 ㄴ Podfile //package.json 에 해당
	 ㄴ Podfile.lock //package.lock.json 에 해당
	 ㄴ Pods //nodemodule
	 ....

<맥에서 쓸수있는 프로그램 XCode>

<안드로이드 스튜디오 Android Studio>

  • react공식문서에 나와있는 버전
$npx create-react-native-app my-app //줄여서 CRNA
$npm start 

CRNA는 네이티브 코드를 컴파일하지 않고 순수 JavaScript로 작성된 CRNA 프로젝트를 로드하고 

Expo 앱을 사용하여 실행합니다.

그렇기 때문에 CRNA를 사용해 프로젝트를 생성할 경우 기존 CLI를 사용해서 생성한 결과물과는 다르게 프로젝트 폴더에 android와 ios 폴더가 없습니다.

  • expo 사용시
$npm install expo-cli
$expo init my-project
$expo start    // or npm start

자신의 스마트폰에서 실시간으로 코드가 적용되는 모습이 보인다.

Expo Documentation에 API 문서 저리가 깔끔하게 잘 되어있다.

React Native CLI Quickstart는 수동으로 설치해야하지만, Expo는 자동으로 다 설치해준다.

핸드폰으로 expoGo 앱을 설치하면 핸드폰으로 바로 확인할 수 있다

expo 사이트 → https://docs.expo.dev/

profile
오늘도 코드 보는중 (。⌒𖧉⌒)⋆.˚⊹⁺

0개의 댓글