Skip to Content
Native AppExpo native 앱 (apps/native-app)

Expo native 앱 (apps/native-app)

apps/native-app은 얼마집의 Expo + React Native 앱입니다. 모노레포의 공유 패키지(@howmuchhome-web/*)를 그대로 재사용하며, 아직 native로 옮기지 않은 화면은 apps/app(Next.js)을 WebView로 로드해 브릿지로 이어 붙입니다. (v1 웹뷰 앱에서의 전환은 사실상 마무리 단계이며, 이 문서군은 현재 native 앱의 설계·컨벤션 레퍼런스입니다.)

빌드/환경 상세는 레포 내 문서도 참고:

  • apps/native-app/README.md — 스택·환경(APP_ENV)·빌드·디렉토리 구조
  • apps/native-app/docs/* — v1→v2 전환기의 목표·결정·브릿지 명세(히스토리 기록)

스택 (요약)

항목선택
Expo SDK56
React Native / React0.85.3 / 19.2.3
라우팅expo-router (파일 기반, src/app/) — 네비게이션
New Architecture활성 (SDK 56 기본)
빌드CNG (Continuous Native Generation) — ios/·android/ 미커밋 — 빌드·배포
스타일링NativeWind v5 (Tailwind v4) — 크로스플랫폼 UI
OTAself-hosted Expo Updates — OTA·버전 관리

APP_ENV(local/development/qa/production/canary)가 단일 진실 공급원으로, app.config.ts가 번들 ID·앱 이름·firebase·OTA 채널 등을 분기합니다. → 빌드·배포

디렉토리 (apps/native-app/src/)

경로내용
app/expo-router 화면. index.tsx=진입 게이팅 라우터(useEntryGating→<Redirect>), _layout.tsx=provider 스택, (tabs)/, webview/ 등
lib/navigation/routes.ts 라우트 레지스트리(하드코딩 push 금지)
components/webview/HowmuchhomeWebView 등 웹뷰 브릿지
api/공유 @howmuchhome-web/api fetcher 주입·queryClient
lib/push·cookies·딥링크 라우팅·datadog·sentry·업로드
store/딥링크 intent 등 클라이언트 상태
shims/web/node 전용 모듈의 RN 어댑터/no-op shim
plugins/ (앱 루트)네이티브 설정 주입 config plugins

공유 패키지 재사용

native는 모노레포의 공유 패키지를 그대로 씁니다. web 전용 전제(RSC/브라우저/DOM)만 native용으로 갈아끼웁니다.

  • @howmuchhome-web/api: configureApiFetcher로 native 쿠키/호스트를 주입해 web과 동일한 API 정의·react-query 훅 사용. → 데이터·상태
  • @howmuchhome-web/ui/native: 공유 UI의 native 구현(.native.tsx/.shared.ts). → 크로스플랫폼 UI
  • @howmuchhome-web/funnel/native: 다단계 플로우의 native 구현(memory 라우터 기반). → 데이터·상태
  • @howmuchhome-web/native-app-shared: native가 소유하되 서버(apps/api)도 참조하는 중립 계약(예: OTA UpdatePolicy). → 패키지
  • web/node 전용 transitive 의존(crypto, datadog 브라우저 SDK, @sentry/nextjs)은 metro.config.js resolver로 RN 호환 처리. → Metro·의존성

문서 지도

시작하기 · 규칙

아키텍처

  • 네비게이션 — expo-router, routes 레지스트리, 진입 게이팅, 딥링크·intent, 웹뷰 브릿지
  • 데이터·상태 — react-query 영속화(MMKV)·Suspense, provider 스택, Funnel native
  • 푸시 알림 — FCM/notifee/Airbridge 수신·표시·탭 라우팅
  • 로깅·모니터링 — Datadog mobile 어댑터, Sentry RN, RUM
  • Metro·의존성 — resolver shim, 아이콘 babel 치환, patch-package

빌드 · 배포 · 운영

  • 빌드·배포 — config plugins, app.config.ts, 릴리즈 제어판, fastlane, 환경
  • OTA·버전 관리 — self-hosted OTA, runtimeVersion, fingerprint 가드, IS_PRERELEASE, updatePolicy

테스트

Last updated on
로깅native 앱 빌드·배포 구성