expo router 로 처음부터 앱 개발 명령어 총정리 , android react native 개발

1. expo router  프로젝트 생성

 npx create-expo-app@latest -e with-router margin-calculator

 margin-calculator는 생성할 이름

 

2, expo go 앱 설치 , 

 

npm run android 

- npm run ios

 

npx expo start

로 실행하고 개발하기

 

expo router 기본 프로젝트 구조
app/
  ├── (tabs)                   // 탭 네비게이션 그룹
  │   ├── _layout.tsx         // 탭 네비게이션 레이아웃
  │   ├── index.tsx           // 홈 탭 스크린
  │   ├── profile/            // 프로필 관련 스택 네비게이션
  │   │   ├── _layout.tsx     // 프로필 스택 레이아웃
  │   │   ├── index.tsx       // 프로필 메인 스크린
  │   │   └── edit.tsx        // 프로필 수정 스크린
  │   └── settings.tsx        // 설정 탭 스크린
  ├── modal/                   // 모달 그룹
  │   ├── _layout.tsx         // 모달 레이아웃
  │   └── index.tsx           // 모달 스크린
  ├── _layout.tsx             // 루트 레이아웃
  └── index.tsx               // 진입점 (선택사항

 

애드몹 광고는 무조건 개발 다 되고 마지막에 붙이자

 (애드몹은 expo go 호환 안됨)

reactnative 애드몹 광고 설치

npx expo install react-native-google-mobile-ads 

 

애드몹 광고 붙이고 나서는 다음으로 실행

npx expo prebuild --platform android

npx expo run:android

오류나면

npx expo prebuild --clean --platform android

(keystore 없어지므로 주의) 로 수행

 

4. 플레이 스토어에 제출할 번들 파일 만들기

abb 파일 빌드해서 최종 제출 방법

 

npx expo prebuild --platform android

cd android

./gradlew clean
./gradlew bundleRelease

 

일반적으로 다음 경로에 파일 생성됨

app/build/outputs/bundle/release/app-release.aab