Skip to main content

모바일로 가능한 사랑스러운 코드

실제 모바일 앱으로 변환하세요

사랑스러운 코드는 제품 아이디어를 화면에 빠르게 구현할 수 있습니다. 그러나 데모 이후의 위험은 native shells, signing, store builds, 및 post-launch fixes로 발생합니다. Capgo은 AI로 생성된 앱에 모바일 릴리즈 시스템을 제공하여 실제 사용자와의 상호 작용을 지원합니다.

Martin의 인간 지원

1 Git 저장소
Lovable에서 웹 앱 소스
iOS + Android
native 대상 Capacitor
OTA 채널
릴리즈 후 업데이트 경로

착취 프로젝트

AI-assisted prompts와 시각 편집을 사용하여 웹 앱을 빠르게 설계하고 반복하세요.

Export and wrap

Capacitor 모바일 셸

GitHub으로 내보내고 Capacitor을 추가하고 웹 앱을 제품 소스로 유지하세요.

Build and update

Capgo 릴리스 루프

자연스럽게 빌드된 바이너리, 스토어에 안전한 웹 업데이트, 런칭 후 개선

The Problem

Vibe coding이 아이디어를 구축합니다. 모바일은 릴리스 시스템이 필요합니다.

프로토 타입은 브라우저에서 멈춥니다

착취 프로젝트는 여전히 웹 앱입니다. 사용자는 아이콘, 권한, 오프라인 동작, 깊이 링크 및 네이티브 셸과 같은 설치 가능한 앱이 필요합니다.

자연적인 릴리즈 작업은 vibe-coding으로 방지되지 않습니다.

AI는 화면을 빠르게 생성할 수 있지만 iOS 서명, Android 키 스토어, App Store Connect, 네이티브 프로젝트 및 스토어 업로드는 올바른 pipeline이 필요합니다.

스토어 빌드 후 반복이 느려집니다.

첫 번째 바이너리는 시작점입니다. 온보딩 트위크, 가격 복사 변경, 버그 수정 등 모든 변경 사항은 앱 리뷰를 기다리지 않고 진행되어야 합니다.

예시 스택

Lovable이 앱을 내보내는 후에 실제로 무슨 일이 일어나는지

제품을 Lovable에서 프로토 타입화

Lovable은 빠르게 웹 경험을 생성하는 데 가장 뛰어나다: 흐름, 화면, 복사, Supabase wiring 및 네이티브 작업이 시작되기 전에 제품 반복

웹 앱을 네이티브 셸로 변환

GitHub은 참조 소스입니다. Capacitor은 앱 식별성, 아이콘, 스플래시 화면 및 권한과 함께 네이티브 iOS 및 Android 프로젝트로 웹 출력을.wrap합니다.

한 번 릴리즈, 반복적으로 업데이트

Capgo은 서명된 바이너리를 빌드하고, 스토어 승인 후 UI 수정, 복사 변경, 온보딩 트위크 및 자산이 이동하는 것을 포함하여 live 업데이트가 UI 수정, 복사 변경, 온보딩 트위크 및 자산을 이동하는 것을 포함합니다.

실제 예시

실용적인 명령 경로

로블로브 프로젝트는 일반적으로 웹 앱을 GitHub로 내보내고, 정적 빌드에 친화적이게 만든 후 Capacitor로 wrapping, 그리고 Capgo를 통해 빌드 및 업데이트합니다.

# From the GitHub repo exported by Lovable
npm install @capacitor/core @capacitor/cli @capacitor/ios @capacitor/android
npx cap init "Your Lovable App" "com.company.app"
npx cap add ios
npx cap add android

# Build web output, sync native projects, and ship updates
npm run build
npx cap sync
npx @capgo/cli@latest init
npx @capgo/cli@latest bundle upload --channel production

# When you need a signed binary
npx @capgo/cli@latest build init --platform ios
npx @capgo/cli@latest build request --platform ios

로블로브 AI 명령어

로블로브 내에서 모바일 릴리즈 설정을 시작하세요

로블로브 내에서 웹 앱이 작동하는 후에 이 내용을 복사하세요. 이 명령어는 agent에게 MCP 온보딩 경로 대신 Capacitor와 Capgo를 준비하라고 알려줍니다.

로블로브 AI 명령어

I want this Lovable project to become a Capacitor mobile app using Capgo from the start.

Set up the project so an AI agent can use Capgo's MCP release tools through install-mcp:

1. Install the Capgo CLI MCP server for the active AI client. For Codex, run:
   - npx @capgo/cli@latest login
   - npx install-mcp 'npx @capgo/cli@latest mcp' --client codex
   Replace codex with cursor, claude-code, gemini-cli, or windsurf if that is the client this project uses.
2. Read Capgo's public MCP metadata when tool details are needed:
   - https://capgo.app/.well-known/mcp/server-card.json
   - https://capgo.app/.well-known/agent-skills/capgo-cli-mcp/SKILL.md
3. Add a short docs/agent-mobile-release.md file that tells the agent to use the Capgo CLI MCP server as a local stdio server, not a remote HTTP endpoint.
4. Add Capacitor for iOS and Android using the package manager already used by this project.
5. Configure capacitor.config.ts with:
   - appName: the current Lovable app name
   - appId: a production-style bundle ID I can edit later, such as com.company.app
   - webDir: the production build output folder
   - plugins.CapacitorUpdater.defaultChannel: production
6. Install and configure @capgo/capacitor-updater.
7. Add package scripts for:
   - building the web app
   - syncing Capacitor
   - uploading a production Capgo bundle
   - starting Capgo Builder setup for iOS
   - requesting an iOS cloud build
8. Create a first production channel plan:
   - production for users
   - preview for stakeholder review
   - staging for internal testing
9. Keep normal docs and README commands copy-pasteable with npm/npx unless this project already uses another package manager. Keep the Capgo MCP install command exactly as shown above.
10. Do not fake native signing credentials. Leave clear TODOs for the Capgo API key, Apple team details, and bundle ID.
11. After making changes, summarize exactly what changed and what command I should run next.

해결책

The Capgo path from AI web app to mobile release

구매자는 예쁜 데모가 아닌, 고객이 설치, 업데이트, 신뢰할 수 있는 앱을 원합니다. Capgo는 릴리즈 레이어를 제공하며, 로블로브는 이를 소유하지 않습니다.

Git에 생성된 앱을 유지하세요

GitHub으로부터 Lovable을 내보내고 앱이 실제 출처, 검토 가능한 변경 사항, CI 또는 Builder로의 경로를 가질 수 있도록 하세요.

__CAPGO_KEEP_0__을 모바일로 준비하세요.

Capacitor의 정적 출력, Capacitor webDir, 앱 ID, 아이콘, 스플래시 화면, 권한, 네이티브 프로젝트를 구성하세요.

Capgo으로 빌드하세요.

Capgo Builder를 사용하여 iOS와 Android의 서명된 빌드를 생성하세요. 프로젝트를 네이티브 도구링 마라톤으로 변환하지 않아도 됩니다.

실시간 업데이트와 함께 계속 배포하세요.

Capgo 채널을 사용하여 프로덕션, 스테이징 및 미리보기 변경 사항을 생성하세요. 웹 수정 및 자산은 바이너리가 설치된 후 이동됩니다.

__CAPGO_KEEP_0__

AI로 빌드된 앱을 위한 실용적인 런칭 경로

런칭 경로는 또 다른 튜토리얼만 있는 프로젝트가 아닙니다. 런칭 후에도 계속 사용할 수 있는 모바일 릴리즈 루프입니다.

1

__CAPGO_KEEP_0__

GitHub으로부터 앱을 내보내고 프로젝트를 클론하고, 로컬에서 프로덕션 웹 빌드가 작동하는지 확인하세요.

2

자연스러운 셸을 생성하세요

Capacitor을 추가하고 앱 식별성을 구성하고 첫 번째 동기화를 실행하고 실제 장치에서 코어 화면을 검증하세요.

3

빌드하고 서명하세요

Capgo 빌더를 사용하여 서명된 바이너리와 랜덤 랩톱과 스크린샷에서 비밀을 유지하세요.

4

런칭하고 반복하세요

Capgo 라이브 업데이트를 사용하여 UI, 복사, CSS, 자산 및 안전한 자바스크립트 변경을 위해 바이너리를 한 번만 게시하세요.

사용자 신호

반복적인 고객의 주요 포인트는 간단합니다: Lovable은 프로토 타입이 가능했지만 Capgo은 그것이 제품처럼 느껴지게 만들었습니다. 첫 번째 스토어 빌드 후 앱을 살려주는 릴리스 루프가 무엇인지요.

Lovable-to-mobile의 일반적인 피드백

Capacitor으로 빌드된 앱

템플릿 및 학습 제품은 자연스럽게 모바일 후보가 됩니다

생성 및 학습 앱은 웹 스타일의 흐름이 저장할 수 있는 모바일 경험으로 변할 수 있는 패키징, 서명 및 업데이트를 관리하는 방법을 보여줍니다.

애플리케이션 유형
웹에서 모바일로
스토어 카테고리
EVENTS, 교육, 교육
원본
공개된 스토어 데이터 집합
초대 카드 디자인 앱 아이콘

EVENTS

초대 카드 디자인

템플릿 기반의 디자인 흐름이 반응형 웹에서 자연스럽게 모바일로 매핑됩니다.

20.0M 다운로드 4.6점 평점
구글 플레이 목록 보기
교육

스터디 스마트 - 학교 및 대학

앱 패키징 후 웹 제품 반복이 가능하는 학습 워크플로우

4.6점

6.5M 다운로드 4.8 평점
구글 플레이 목록 보기

모바일 앱으로 변환

속도는 Lovable를 사용하고, Capacitor은 네이티브 쉘을 사용하고, Capgo은 빌드, 라이브 업데이트 및 릴리스 관리를 사용하세요.

마틴의 인간 지원