모바일 앱 개발 기술 스택 안내
모바일 앱 개발 기술 스택 안내
개요
DUOLABS의 모바일 앱 개발은 iOS와 Android 앱을 대상으로 합니다. 프로젝트의 기능, 사용자 경험, 기존 팀의 기술 환경과 네이티브 연동 요구를 검토한 뒤 Flutter 또는 React Native·Expo 중 적합한 기술을 선택합니다.
이 문서는 모바일 앱 클라이언트 기술 스택을 설명합니다. 반응형 웹앱, Flutter Web, React Native Web, PWA, 관리자 웹, 홈페이지와 신규 백엔드 API 개발은 모바일 앱 개발 범위에 포함하지 않습니다.
지원 대상
모바일 앱 개발에서 다루는 범위는 다음과 같습니다.
- iOS·Android 앱 화면과 사용자 흐름
- 앱 내부 상태 관리와 로컬 데이터 저장
- 기존 API 연동
- 로그인·인증의 앱 측 처리
- 카메라, 위치, 알림 등 기기 기능 연동
- 푸시 알림 수신과 화면 이동
- 테스트 빌드와 앱스토어 제출
- 앱 오류와 충돌 정보 수집
다음 항목은 별도 웹서비스 또는 백엔드 개발 범위입니다.
- 신규 백엔드 API와 서버 업무 규칙
- 데이터베이스 모델과 접근 권한 정책
- 관리자 웹과 운영 대시보드
- 서비스 소개 홈페이지
- 반응형 웹사이트와 웹앱
- 서버 측 푸시 발송 자동화
- 결제·구독을 관리하는 서버
Flutter 기술 스택
Flutter는 Dart로 작성하며 하나의 모바일 코드베이스에서 iOS와 Android 앱을 구성합니다. 프로젝트 성격에 따라 세부 라이브러리는 달라질 수 있지만 다음 구성을 기본 후보로 사용합니다.
Dart + Flutter
├─ Riverpod 앱 상태 관리
├─ go_router 화면 이동·딥링크
├─ Dio 또는 http API 통신
├─ flutter_secure_storage 인증정보 보관
├─ Drift 또는 SQLite 오프라인 데이터
├─ Firebase Messaging 푸시 알림
├─ Crashlytics 또는 Sentry 오류·충돌 수집
└─ GitHub Actions·Fastlane 테스트·빌드·스토어 제출
Flutter가 적합한 경우
- iOS와 Android에서 일관된 디자인 시스템이 중요할 때
- 커스텀 UI와 애니메이션 비중이 높을 때
- 모바일 앱을 독립된 제품으로 장기간 운영할 때
- Dart 기반의 명확한 앱 코드 경계를 선호할 때
- 네이티브 SDK와 기기 기능을 세밀하게 연동해야 할 때
Flutter는 iOS와 Android를 공식 지원하며 필요한 경우 Swift·Objective-C 또는 Kotlin·Java 네이티브 코드와 연결할 수 있습니다.
React Native·Expo 기술 스택
React Native는 TypeScript와 React 방식으로 iOS와 Android 앱을 구성합니다. 신규 프로젝트에서는 React Native 공식 권장에 따라 Expo 기반 구성을 우선 검토합니다.
TypeScript + React Native + Expo
├─ Expo Router 화면 이동·딥링크
├─ TanStack Query 서버 데이터·캐시
├─ Zustand 앱 상태 관리
├─ Expo SecureStore 인증정보 보관
├─ Expo SQLite 오프라인 데이터
├─ Expo Notifications 푸시 알림
├─ Sentry 오류·충돌 수집
└─ EAS Build·Submit·Update 빌드·제출·호환 업데이트
Expo Application Services(EAS)는 빌드, 내부 테스트 배포, 앱스토어 제출과 호환되는 JavaScript·에셋 업데이트를 자동화하는 선택 서비스입니다. 네이티브 코드나 권한이 바뀌는 업데이트는 새로운 앱 바이너리를 만들어 스토어 절차를 거쳐야 합니다.
React Native·Expo가 적합한 경우
- 기존 팀이 React와 TypeScript에 익숙할 때
- 웹과 앱에서 타입, 검증 규칙, API 모듈을 공유할 때
- Expo 생태계로 테스트와 배포 과정을 단순화하고 싶을 때
- JavaScript·TypeScript 라이브러리를 적극적으로 활용할 때
- 기존 React Native 앱을 확장하거나 네이티브 앱에 일부 화면을 추가할 때
Expo에서 지원하지 않는 특수 네이티브 제약이 있거나 기존 네이티브 프로젝트에 깊게 통합해야 한다면 React Native Community CLI 구성을 별도로 검토합니다.
Flutter와 React Native 선택 기준
| 기준 | Flutter | React Native·Expo |
|---|---|---|
| 주 언어 | Dart | TypeScript |
| 적합한 경험 | 모바일 앱 중심 | React·웹 개발 경험 활용 |
| UI 구성 | Flutter 위젯으로 일관된 화면 구성 | React 방식으로 네이티브 앱 구성 |
| 상태 관리 후보 | Riverpod | TanStack Query·Zustand |
| 기본 배포 흐름 | CI·Fastlane | EAS Build·Submit |
| 빠른 코드 업데이트 | 별도 배포 정책 검토 | EAS Update로 호환 범위 지원 |
| 우선 검토 상황 | 커스텀 디자인·모바일 제품 중심 | React 생태계·개발 흐름 활용 |
두 기술 모두 iOS와 Android 앱을 제작할 수 있습니다. 프레임워크 이름만으로 결정하지 않고 다음 순서로 선택합니다.
- 필수 화면과 기기 기능을 확인합니다.
- 사용할 외부 SDK가 각 프레임워크를 지원하는지 확인합니다.
- 기존 개발팀의 언어와 유지보수 환경을 확인합니다.
- UI와 성능 요구가 높은 기능은 작은 기술 검증으로 확인합니다.
- 검증 결과를 바탕으로 하나의 스택을 확정합니다.
공통 모바일 기능
로그인과 보안 저장소
앱은 비밀번호나 관리자용 비밀값을 코드에 포함하지 않습니다. 서버가 발급한 세션 정보는 iOS Keychain과 Android Keystore를 이용하는 보안 저장소에 보관합니다.
푸시 알림
푸시 알림은 Firebase Cloud Messaging을 공통 전달 계층으로 사용하고 iOS에서는 Apple Push Notification service와 연결합니다. 앱이 열려 있는 상태, 백그라운드 상태, 종료된 상태를 각각 처리하고 알림을 눌렀을 때 해당 화면으로 이동하도록 구성합니다.
오프라인 데이터
네트워크가 불안정한 환경에서 필요한 데이터는 기기에 저장할 수 있습니다. 저장 대상, 동기화 시점, 충돌 해결 방식은 데이터 성격에 따라 결정합니다.
오류 수집
출시 후 발생하는 충돌과 비정상 종료를 확인할 수 있도록 Crashlytics 또는 Sentry 같은 오류 수집 도구를 연결합니다. 개인정보와 민감한 입력값이 오류 로그에 포함되지 않도록 수집 범위를 제한합니다.
별도 웹서비스 스택 요약
모바일 앱이 새로운 서버 기능을 필요로 한다면 웹서비스와 백엔드를 별도 범위로 설계합니다.
Flutter 또는 React Native 앱
↓ HTTPS
백엔드 API
↓
Supabase
필요한 기능에 따라 다음 서비스를 조합할 수 있습니다.
| 서비스 | 서버 측 역할 |
|---|---|
| Vercel Functions | 별도로 개발한 API와 서버 함수 실행 |
| Supabase | PostgreSQL, 인증, 파일 저장 |
| Upstash Redis | 요청 제한, 캐시, 중복 처리 방지 |
| QStash | 비동기 작업 전달, 예약 실행, 실패 재시도 |
| Resend | 인증·상태·운영 이메일 발송 |
이 서비스들은 모바일 앱 클라이언트 기술 스택이 아닙니다. 기존 백엔드가 있으면 앱은 해당 API에 연결하고, 신규 구축이 필요하면 데이터와 업무 규칙을 확인해 별도로 설계합니다.
배포와 계정
Apple과 Google 개발자 계정은 서비스를 운영하는 고객 명의로 개설하는 것을 기본으로 합니다. DUOLABS는 필요한 권한을 위임받아 테스트 배포와 스토어 제출을 진행합니다. 소스 저장소, 앱 서명 권한, 스토어 정보와 외부 서비스 계정을 분리해 두면 운영 주체가 바뀌어도 인수인계가 쉽습니다.
참고
- Flutter 지원 플랫폼
- Flutter 지속적 배포
- React Native 시작 안내
- React Native 프레임워크 권장 안내
- Expo EAS Build
- Expo EAS Update
- Flutter용 Firebase Cloud Messaging
- Supabase Flutter SDK
세부 라이브러리와 배포 서비스는 프로젝트 요구사항과 공식 지원 상태를 확인한 뒤 확정합니다.