PWA에서 App Store까지: builder77로 Flutter 앱 출시하기

예전에는 앱을 누군가의 휴대폰에 올리려면 플랫폼을 고르고, 개발 도구를 배우고, 심사 대기열을 기다려야 겨우 써 보게 할 수 있었어요. builder77은 이 과정을 두 단계로 나눠요. 오늘 PWA를 출시해서 실제 사람들이 쓰게 하고, App Store와 Google Play에 올릴 준비가 되면 네이티브 Flutter로 넘어가요.

1단계: 사용자가 지금 바로 설치할 수 있는 PWA

builder77에서 모바일 앱을 만들면 처음부터 휴대폰 앱으로 디자인돼요. 화면 전체 높이 레이아웃, 하단 탭 내비게이션, 큼직한 터치 영역, 노치 화면을 위한 안전 영역 여백이 들어가요. 게시하면 웹 앱 매니페스트와 서비스 워커가 추가되어 설치할 수 있게 돼요.

• 게시를 누르고 휴대폰으로 QR 코드를 스캔하세요.
• iPhone에서는 공유 → 홈 화면에 추가를 누르세요. Android에서는 설치 안내나 브라우저 메뉴를 쓰세요.
• 앱이 자기 아이콘과 함께 전체 화면으로 열려요. 네이티브 앱과 똑같아요.

피드백을 받는 가장 빠른 방법이에요. 오늘 오후에 테스터 열 명에게 링크를 보내고, 어떻게 쓰는지 지켜보면서 빌더에서 계속 개선할 수 있어요. 게시할 때마다 스토어 심사 없이 모든 사람의 앱이 바로 업데이트돼요.

2단계: Flutter로 변환하기

앱이 어느 정도 완성되면 Flutter 탭을 열고 변환하세요. 메시지 크레딧 30개가 들어요. builder77이 웹 앱과 같은 화면, 기능, 디자인을 갖춘 Flutter 프로젝트(pubspec.yaml과 lib/main.dart)를 Material 3로 만들어요.

중요한 점은 Flutter 앱이 builder77 REST API를 통해 같은 컬렉션 이름과 필드 이름으로 같은 클라우드 데이터베이스에 연결된다는 거예요. PWA에서 만든 데이터가 네이티브 앱에도 나타나고 그 반대도 마찬가지이며, 앱 사용자는 어느 쪽에서든 로그인할 수 있어요.

// Generated at the top of lib/main.dart
const String kApiBase = 'https://builder77.com';
const String kProjectId = 'your-project-id';

// Example call made by the generated M77Client
// GET $kApiBase/api/runtime/$kProjectId/db/habits?sort=-createdAt

다운로드하기 전에 먼저 써 보기

아무것도 설치하지 않고 Flutter 탭에서 바로 Flutter 버전을 써 볼 수 있어요.

• DartPad: 생성된 코드를 DartPad에서 열어 빠르게 확인해요.
• 코드: 생성된 Dart 코드를 빌더에서 바로 읽고 수정한 다음 저장해요.

이상한 부분이 있으면 채팅으로 수정을 요청하고 다시 변환하세요. 기준이 되는 것은 웹 앱이라서, 보통은 웹 버전을 먼저 제대로 만든 다음 Flutter 프로젝트를 다시 생성하는 편이 좋아요.

프로젝트 다운로드하고 열기

Starter 이상에서는 Flutter 프로젝트를 다운로드할 수 있어요. 그다음은 일반적인 Flutter 작업 흐름이에요.

flutter create .          # adds the ios/ and android/ platform folders
flutter pub get
flutter run               # on a simulator or a connected device

스토어에 출시하기

가장 간단한 방법은 이거예요. 모바일 앱이라면 게시 창이나 Flutter 탭에서 App Store와 Google Play에 게시를 누르세요. 월 $99로 저희 팀이 앱을 빌드해서 두 스토어에 올리고, 이후 업데이트도 모두 올려 드려요. 직접 제출하고 싶다면 내 개발자 계정으로 Apple과 Google의 도구에서 진행해요. 일반적인 체크리스트는 다음과 같아요.

• 고유한 번들 ID / 애플리케이션 ID와 앱 이름을 정해요.
• 두 플랫폼용 앱 아이콘과 실행 화면을 추가해요.
• 서명을 설정해요. iOS는 배포 인증서와 프로비저닝 프로필, Android는 업로드 키스토어가 필요해요.
• flutter build ipa와 flutter build appbundle로 릴리스 바이너리를 빌드해요.
• 스토어 등록 정보를 준비해요. 스크린샷, 설명, 개인정보 관련 정보, 지원 URL이 필요해요.
• App Store Connect와 Google Play Console에서 심사를 제출해요.

스토어 심사에서는 개인정보를 꼼꼼히 봐요. 앱에 로그인이 있고 개인 데이터를 저장한다면 개인정보 처리방침 URL이 필요해요. builder77에게 웹 앱에 개인정보 처리방침 페이지를 추가하고 링크를 걸어 달라고 요청하면 돼요.

PWA도 계속 두기

네이티브 앱을 출시한다고 웹 버전을 없앨 필요는 없어요. PWA는 같은 데이터로 계속 작동하기 때문에 사람들은 브라우저에서, 데스크톱에서, 또는 스토어에서 설치하기 전에도 앱을 쓸 수 있어요. 입구가 두 개이고 백엔드는 하나인 제품이에요.

저희 조언은 이래요. PWA로 검증하고, 사용자가 원할 때 변환하고, 스토어 버전은 사람들이 이미 좋아하는 것을 더 다듬은 버전으로 생각하세요.