리액트 네이티브 앱 개발 #1 React native Expo 프로젝트 만들기

React Native Expo 프로젝트 시작

React Native 공식 홈페이지의 설치 가이드 따라하기.

Started with React Native with Expo?

Expo는 프로덕션 등급의 React Native Framework입니다. Expo는 파일 기반 라우팅, 네이티브 모듈의 표준 라이브러리 등과 같이 앱 개발을 더 쉽게 만드는 개발자 도구를 제공합니다.

Expo의 프레임워크는 무료 오픈 소스이며 GitHub 및 Discord 에서 활발한 커뮤니티를 보유하고 있습니다 . Expo 팀은 Meta의 React Native 팀과 긴밀히 협력하여 최신 React Native 기능을 Expo SDK에 제공합니다.

https://reactnative.dev/docs/environment-setup?guide=quickstart

Get Started with React Native · React Native

 

React Native 프로젝트 생성

새로운 React Native Expo 프로젝트를 생성하려면 터미널에서 다음을 실행하세요.

npx create-expo-app@latest

 

앱 프로젝트 이름을 생각해 놓으세요 ^^
위 명령을 실행하면 리액트 네이티브 프로젝트 설치 후 프로젝트 APP 이름을 등록 합니다.

C:\dev\rn>npx create-expo-app@latest
Need to install the following packages:
create-expo-app@3.0.0
Ok to proceed? (y) y

√ What is your app named? ... soapp
√ Downloaded and extracted project files.
> npm install

프로젝트 설치가 완료되면, 위에 등록한 App 폴더로 이동 합니다.

cd soapp (app name)

 

리액트 네이티브 실행하기

프로젝트 설치 및 실행 까지 2번 실행으로 앱 까지 확인 가능 합니다. ㅎㅎ;; ?

C:\dev\rn\soapp>npm start

 

프로젝트 생성 후 실행하면 Expo를 통해 웹과 앱에서 바로 확인 가능!

Expo 앱을 통해 네이티브 환경 테스트도 바로 가능하니... 개발 단계에서 이만한 환경은 없을 듯?

npm start 후 터미널 화면 가이드 대로 실행해 봅니다.
w 와 a 를 각각 선택 후 웹과 모바일이 실행된 화면

 

React Native-cli 와 Expo 비교를 위해 설치해보았습니다.
많이 간변하게 설치가 되는데... 조금 많이 무거워 지는 느낌?