본문 바로가기

STUDY/React Native

React Native | Expo CLI로 프로젝트 생성 /실행하기

Expo CLI

create-react-app처럼 필요한 기본 세팅을 빠르게 해줌

Expo앱을 이용하면 본인의 휴대폰에서 바로바로 앱을 테스트 해볼 수 있다!

native파일들을 제어하기 힘듦

필요한 모듈들을 많이 지원하고 있음

React Native CLI

native파일들에 접근할 수 있음

XCode나 Android Studio가 필요

 

0. Node설치

node.js가 설치되어있지 않다면 설치해주어야 하며, 버전이 12 LTS이상이어야 함

설치되어있음

없으면 다운로드 및 설치 해주기

 

Download | Node.js

Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine.

nodejs.org

 

1. expo설치

-g는 글로벌하게 설치하겠다는 뜻 붙여주지 않아도 됨

npm install -g expo-cli

 

2. 프로젝트 생성

프로젝트 생성할 경로로 이동 후 expo init 프로젝트명 입력

원하는 템플릿을 선택(방향키로 바꿀 수 있음) 후 엔터

 

 

3. 프로젝트 실행

npm혹은 expo start로 프로젝트를 실행할 수 있음

npm start

 

expo start

 

🪓본인 휴대폰에서 실행하는 법

✔️expo앱을 본인의 휴대폰에 다운받은 후, 회원가입 진행

✔️터미널에서 expo login을 통해 로그인 하면 expo앱을 통해 실시간으로 확인가능

✔️안드로이드 유저는 QR코드를 스캔하여 바로 실행 가능

💥만약 실행이 안된다?! 휴대폰이 와이파이에 연결되어있는지 확인해보자...

 

🪓XCode 시뮬레이터로 실행하는 법

Run on iOS simulator 클릭하면 알아서 XCode시뮬레이터가 켜지는데, 에러 발생할 경우 터미널에 아래 명령어 입력 후 다시 시도할 것

sudo xcode-select -s /Applications/Xcode.app

 

🪓개발자 모드

✔️앱에서는 휴대폰을 한 번 흔들면 나옴

✔️시뮬레이터에서는 Ctrl+D (cmd + D)