プロトタイプはブラウザで止まります。
魅力的なプロジェクトはまだウェブアプリです。ユーザーはインストール可能なアプリ、アイコン、パーミッション、オフライン動作、ディープリンク、ネイティブシェルが必要です。
モバイル向けの愛らしさのあるコーディング
モバイルアプリに愛らしさのあるコーディングを実現
Lovable can get the product idea on screen fast. The risk comes after the demo: native shells, signing, store builds, and post-launch fixes. Capgo gives that AI-built app a mobile release system that survives real users.
愛らしさのあるコーディングは、製品のアイデアを画面に表示することができます。デモ後、ネイティブシェル、署名、ストアビルド、ポストラウンチューンの修正など、リスクが生じます。__CAPGO_KEEP_0__は、AIで作成されたアプリにモバイルリリースシステムを提供し、実際のユーザーに耐えることができます。
チュートリアルを読む
1つのGitリポジトリ
LoveableからWebアプリのソース
native targets with Capacitor
ネイティブターゲットと__CAPGO_KEEP_0__
OTAチャンネル
魅力プロジェクト
AIアシストのプロンプトと視覚的な編集で、ウェブアプリを迅速に設計して実行できます。
エクスポートしてラップ
Capacitor mobile shell
Export to GitHub, add Capacitor, and keep the web app as the product source.
ビルドして更新
Capgo release loop
ネイティブバイナリをビルドし、ストアセーフなウェブアップデートを公開し、リリース後に改善することができます。
問題
Vibe codingでアイデアが実現されます。モバイルにはリリースシステムが必要です。
ネイティブリリース作業はビブコーディングされません
AIはスクリーンを迅速に生成できますが、iOS署名、Androidキーストア、App Store Connect、ネイティブプロジェクト、およびストアアップロードには正しいパイプラインが必要です。
イテレーションはストアビルド後で遅くなります
最初のバイナリはただの始まりです。オンボーディングの調整、価格のコピーの変更、またはバグの修正は、また別のフルアプリレビューを待つ必要はありません。
例のスタック
Lovableがアプリをエクスポートした後、実際に何が起こるのか
製品をLovableでプロトタイプ化する
Lovableは、ネイティブ作業が始まる前に、ウェブエクスペリエンスを迅速に作成することに最適です: フローの作成、スクリーンの作成、コピーの作成、Supabaseのワイヤリング、および製品のイテレーション
ウェブアプリをネイティブシェルに変換する
GitHubはソースとなるものになります。Capacitorはウェブ出力をネイティブのiOSとAndroidプロジェクトにラップし、アプリのアイデンティティ、アイコン、スプラッシュスクリーン、パーミッションを含みます。
一度リリースし、イテレーションを続ける
Capgoは署名されたバイナリを生成し、ストア承認後もUIの修正、コピーの変更、オンボーディングの調整、資産の更新が可能になります。
実際の例
実用的なコマンドパス
Lovableのプロジェクトは、生成されたWebアプリをGitHubにエクスポートし、静的ビルドに適したものにし、Capacitorでラップし、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 iosLovable AIのプロンプト
モバイルリリースのセットアップをLovable内で開始する
Paste this into Lovable after your web app is working. It tells the agent to prepare Capacitor and Capgo with the MCP onboarding path instead of treating mobile as a one-off export.
ソリューション
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.Lovableからモバイルへのパスは、AI Webアプリからモバイルリリースまでのものです。
購入者はデモがきれいなものが欲しくありません。彼らは、更新や信頼できるアプリをインストールできるようにしたいと考えています。Capgoは、Lovableが所有していないリリース層を提供します。
The buyer does not want a pretty demo. They want an app customers can install, update, and trust. Capgo supplies the release layer Lovable does not try to own.
Lovableのプロジェクトは、生成されたWebアプリを__CAPGO_KEEP_0__にエクスポートし、静的ビルドに適したものにし、__CAPGO_KEEP_1__でラップし、__CAPGO_KEEP_2__でビルドおよび更新することでモバイルになることがよくあります。
GitHub から Lovable にエクスポートして、アプリに実際のソース、レビュー可能な変更、CI または Builder へのパスを提供します。
モバイル対応にする
静的出力、Capacitor webDir、アプリ ID、アイコン、スプラッシュ画面、パーミッション、ネイティブ プロジェクトを設定します。
Capgo でビルドする
Capgo の Builder を使用して、ネイティブ ツールのマラソンにプロジェクトを変えることなく、署名済みの iOS と Android ビルドを作成します。
ライブ更新で継続して発送する
Capgo のチャンネルを使用して、生産、ステージング、プレビューの変更を実行して、ウェブの修正とアセットをインストールされたバイナリの後で動作します。
リリースパス
AI で作成されたアプリの実用的なリリースパス
リリースパスの目標は、もう一つのチュートリアルのみのプロジェクトではありません。リリース後も使用できるモバイル リリース ループです。
1
アプリをエクスポートする
GitHub に Lovable を接続し、プロジェクトをクローンし、ローカルで生産用のウェブビルドが正常に動作することを確認します。
2
Nativeシェルを作成
Capacitorを追加し、設定、アプリのアイデンティティ、最初の同期、実機デバイス上のコア画面の検証を行います。
3
ビルドと署名
署名済みバイナリ用にCapgoビルダーを使用し、ランダムなノートブックやスクリーンショットからシークレットを除外します。
4
リリースと反復
バイナリを一度だけ公開し、Capgoのライブアップデートを使用してUI、コピー、CSS、アセット、安全なJavaScriptの変更を行います。
ユーザー信号
「Lovableはプロトタイプを作成可能にしましたが、Capgoはそれが製品のように感じられるようにしました。最初のストアビルド後、リリースループがアプリを生き続けます。」
愛らしさのあるLovable-to-mobileの共通フィードバック
Capacitorで作成されたアプリ
テンプレートや学習製品は自然なモバイル候補です
作成と学習アプリは、パッケージング、署名、更新をきれいに管理することで、ウェブスタイルのフローをストアに準備できるモバイルエクスペリエンスを示しています。
イベント
招待状作成カードデザイン
レスポンシブウェブから自然にマップされるテンプレートドライブデザインフロー。
2,000万インストール
4.6星評価
教育
無限の日本語
小さなレッスンとオンボーディングの改善が積み重なる学習アプリ
180万インストール
4.6星
教育
StudySmarter - 学校 & 大学
アプリパッケージング後もウェブ製品の改良が可能な学習ワークフロー
6.5Mのインストール
4.8の評価
モバイルアプリにインストールできるアプリケーションに変換する
スピードでLovableを使用し、ネイティブシェルはCapacitor、ビルド、ライブアップデート、リリース管理はCapgoで
マーティンから人間のサポート