React Native

Native는 React Native CLI 방식과 Expo CLI 방식이 있다.
이중 Expo CLI 방식을 사용해보자!

설치

자신이 작업하려하는 상위 폴더에 설치하여준다!

npm install -g expo-cli

---

버전 확인 & 폴더 설치

버전을 확인하여 준다.

expo --version

작업 폴더를 만들어준다.

mkdir React_Native

---

다운로드

만들어진 작업 폴더로 들어가 app을 다운로드 해준다

expo init [작업명 or 앱이름]

🔔window 는 이방식으로 설치해야 한다!

npx create-expo-app --template

Blank - 아무 뼈대도 없다

Blank(TypeScript) - 타입스크립트가 정해져있다.

Blank 선택후 앱 이름을 작성하면 다운로드가 되어진다!

---

실행

ls로 native 를 확인 하여 들어간다

yarn start

QR코드가 뜨면 정상적으로 완료 된 것!

🔔안뜨면 파워셀로 하자!

---

어플 실행

expo.dev 가입해서 계정을 만든 후

https://expo.dev/signup

AppStore 에서 Expo Go를 다운받아 로그인한다

카메라로 QR코드를 스캔하여 다운받은 Expo Go 를 실행시켜주면 끝

---

VS코드 연동

init 으로 만든 폴더를 VS코드에서 열면 .expo를 확인 할 수있다!

터미널을 열어 package를 추가하자

• yarn add @react-navigation/bottom-tabs
• yarn add @react-navigation/native
• yarn add react-native-safe-area-context
• yarn add react-native-webview
• yarn add react-native-loading-spinner-overlay

이후 MyTabs.js App.js Package.json을 수정해준다!

---

키 받아 적용하기

eas init

app.json

  "extra": {
      "eas": {
        "projectId": "[받은 키값]"
      }    

키 를 입력하여

eas build -p android 를 실행시켜준다. 끝!