Google AI Studioでバイブコーディング：手順・制限・公開方法

Google AI StudioのBuildモードでバイブコーディングする手順、できること・できないこと、Starter Tierの2アプリ制限、アプリの公開とエクスポート方法を解説します。

よくある質問

Google AI Studioのバイブコーディングとは何ですか？

aistudio.google.com/apps にあるBuildモードのことです。作りたいアプリを普通の言葉で説明すると、Geminiがコードを生成し、隣にライブプレビューが表示されます。Googleのドキュメントによると、Webアプリは既定でReactのフロントエンドとNode.jsのサーバーサイドランタイムで構成され、ネイティブAndroidアプリ（KotlinとJetpack Compose）も選べます。仕上げはチャットで指示するか、プレビュー上の注釈モードで行います。ドキュメントは2026年11月に確認しました。

Google AI Studioのバイブコーディングは無料ですか？

GoogleのBuild and deployドキュメントには、無料枠についての記載がありません。アプリからのAPI呼び出しは利用上限にカウントされ、有料モデルを使う場合は料金が発生することがある、と説明されています。Starter Tierでは、対象アカウントであればGoogle Cloudプロジェクトや請求先アカウントがなくても、フルスタックアプリを最大2つまで公開できますが、利用量に応じてCloud Runの料金がかかる場合があります。現在の料金は、AI Studioの請求（Billing）ページでご自身のアカウントについて確認してください。

Google AI Studioで作ったアプリはどうやって公開しますか？

右上の「Publish」をクリックします。Starter Tierの場合は続けて「Get Started」と「Publish App」をクリックすると、Cloud RunのURLが発行されます。標準のデプロイには、AI Studioアカウントにリンクされた、請求が有効なGoogle Cloudプロジェクトが必要です。プロジェクトをGitHubに同期したり、ZIPをダウンロードして自分でホスティングすることもできます。

Google AI StudioのアプリをGitHubや自分のホスティング先にエクスポートできますか？

はい、できます。AI Studioは双方向のGitHub同期に対応しており、設定（Settings）の「GitHub」タブから管理します。AIが生成するコミットメッセージと、「Resolve conflicts」ダイアログによる競合解消も利用できます。ZIPでダウンロードすることも可能です。他の環境でコードを動かす場合は、環境変数GEMINI_API_KEYをご自身で設定する必要があります。

公開したアプリでGemini APIキーが漏れることはありますか？

新しいWebアプリでは、AI StudioがGEMINI_API_KEYをサーバーサイドのシークレットとして保存し、Secretsパネルで確認できます。Googleのドキュメントによれば、このキーがクライアント側のコードに含まれることはありません。ただし、公開したアプリはすべての訪問者のGemini呼び出しにあなたのキーを使うため、その利用量は上限と料金にそのまま反映されます。

Starter Tierで公開できるのはどんな人ですか？

Googleのデプロイページによると、Google Workspaceアカウントでサインインしている場合は対象外です。有料のGoogle Cloud請求先アカウントを現在お持ちの方や過去に利用していた方、利用実績が十分に確認できないアカウントも対象外となります。また、サポートが対象可否を覆すことはできないとも記載されています。対象外の場合は、請求が有効なGoogle Cloudプロジェクトを使った標準のデプロイを利用してください。

結論： Google AI Studioのバイブコーディングは、aistudio.google.com/apps にあるBuildモードで行います。作りたいアプリを説明すると、GeminiがReactのフロントエンドとNode.jsサーバー（またはネイティブAndroidアプリ）を書いてくれるので、ライブプレビューを見ながら調整していきます。完成したら「Publish」でCloud Runに公開するか、GitHubに同期するか、ZIPでダウンロードできます。ただし、訪問者のGemini呼び出しはあなたのキーで実行されるため、リンクを共有する前に下記の制限を必ず確認してください。内容はすべて2026年11月時点のGoogleのドキュメントで確認しています。

Buildモードでできること

Buildモードは、AI Studio内でプロンプトからアプリを作る環境です。Googleのドキュメントによると、次のような機能があります。

  • Webアプリ（既定）： Reactのフロントエンドと、安全なAPI呼び出し・データベース接続・npmパッケージ利用のためのNode.jsサーバーサイドランタイム。必要なパッケージはエージェントがインストールします。
  • Androidアプリ： KotlinとJetpack Composeで作成。ブラウザ上のエミュレーターでプレビューでき、ブラウザからADB経由で実機にインストールでき、内部テスト用にPlayストアへ公開することもできます。
  • 組み込みの連携機能： Firebase FirestoreとFirebase Authentication（Googleでログイン）、Gmail・Sheets・Docs・Drive・CalendarなどのGoogle Workspace連携（OAuthは自動設定）、サーバーランタイムによるマルチプレイヤー状態の管理。
  • その他のデータベース： ドキュメントによれば、ネットワーク経由で接続できるストレージであれば利用できます。ただし、動的IPレンジについてはファイアウォールの制限があります。

この言葉に馴染みがない方は、バイブコーディングとはの解説をご覧ください。Buildモードは、その考え方を実現するひとつの形です。

Google AI Studioでバイブコーディングする手順

  1. Buildモードを開く。 aistudio.google.com/apps にアクセスし、プラットフォームの選択でWebアプリ（既定）かネイティブAndroidを選びます。
  2. プロンプトを書く。 誰が使うアプリか、メイン画面に何を表示するか、どんなデータを扱うかを説明します。AI Chipsを使えば画像生成やGoogle Mapsのデータといった機能を追加でき、音声入力（speech-to-text）での指示も可能です。アイデアに詰まったときは「I'm Feeling Lucky」で案を生成できます。
  3. 既存のものから始める。 App Galleryでアプリを開いて「Copy App」を選べばリミックスできます。プロンプト欄の「Add files (+)」メニューにある「Import from GitHub」も使えます。
  4. 実行してプレビューを確認する。 生成されたファイルは右側のライブプレビューとともに表示されます。「Code」タブでソースコードを確認できます。
  5. 少しずつ修正する。 1回のメッセージで頼む変更は1つにします。見た目の調整には注釈モードが便利です。UIの該当部分をハイライトして、変えたい内容を伝えてください。
  6. 権限を設定する。 アプリでカメラ、マイク、位置情報を使う場合は、ドキュメントに従い、metadata.jsonのrequestFramePermissionsにそれらのブラウザAPIを記載します。
  7. シークレットを確認する。 Settingsの「Secrets」パネルでGEMINI_API_KEYを確認し、サーバーコードに必要な他のキーもここに追加します。
  8. 保存または公開する。 GitHubに同期するか、ZIPをダウンロードするか、「Publish」をクリックします。

最初の下書きの精度が上がるプロンプトの書き方

小さな陶芸教室の予約ページを作ってください。訪問者は一覧からクラスを選び、日付を選んで、名前とメールアドレスを入力します。申し込みはFirestoreに保存し、確認画面を表示してください。レイアウトは1カラムでモバイルファーストにし、ログイン機能は付けないでください。

データの保存先、画面、入れないものを明記しておくと、エージェントが勝手に機能を作って、あとで削除する手間が減ります。

公開・エクスポート方法の比較

方法得られるもの必要条件（Googleのドキュメントより）注意点
Publish（Starter Tier）Cloud RunのURL、任意でyour-app-name.ai.studioのサブドメイン対象アカウントであること。Google Cloudプロジェクトも請求先アカウントも不要サービスは合計2つまで、Cloud Runのリージョンは1つのみ。Workspaceアカウントと、有料のCloud請求先アカウントがあるアカウントは対象外
Publish（標準デプロイ）スケーラブルなCloud RunサービスAI Studioにリンクされた、請求が有効なGoogle Cloudプロジェクト利用量に応じてCloud Runの料金がかかる場合あり
GitHub同期コミットメッセージ付きの双方向リポジトリ同期Settingsの「GitHub」タブマージの競合はダイアログで解消
ZIPダウンロードどこでも動かせるコードGEMINI_API_KEYを自分で設定するホスティング、シークレット、更新は自分で管理

Starter Tierでの公開は、「Publish」→「Get Started」→「Publish App」の3クリックです。すでに2つのアプリを公開している場合は、どちらかの公開を停止するか、アップグレードが必要です。カスタムサブドメインは先着順で、公開を停止するか削除すると解放されます。

共有前に知っておきたい制限とリスク

  • 訪問者の利用料もあなたのキーにかかります。 公開したアプリは、すべてのユーザーの呼び出しにあなたのGemini APIキーを使います。ドキュメントでは、有料モデルを使う場合は料金が発生することがあると注意されています。共有の前には、AI Studioが警告を表示します。
  • アプリは最初は非公開です。 共有した相手はコードを見たりフォークしたりでき、編集権限を持つ相手はコードを変更できます。
  • リアルタイムの共同編集はできません。 Googleのドキュメントによると、ライブでの共同編集には対応していません。チームでの共同作業には、共有のGitHubリポジトリを使います。
  • 共有リンクが開けないことがあります。 ドキュメントには、Privacy Badgerなどのプライバシー拡張機能やビルドエラーが原因で、403 Access Restrictedエラーが出ることがあると書かれています。
  • アプリの動作には自分で責任を持つ必要があります。 ポリシー違反があればアプリが削除されることがあり、アプリの動作とデータについては開発者が責任を負います。
  • 古いアプリ。 2026年5月14日より前に作られたアプリは、Gemini関連の機能を次に変更したときに、サーバーサイドのキー方式へアップグレードされます。

私たちが確認したGoogleのページには、無料枠のリクエスト数やトークン数が記載されていなかったため、数値は掲載していません。ご自身のアカウントに適用される内容は、AI Studio内の請求（Billing）ページで確認してください。

公開前にコピーして使えるチェックリスト

  • [ ] ログイン済みのブラウザだけでなく、新しいブラウザプロファイルでもプレビューで動作する
  • [ ] シークレットはコードやプロンプトに貼り付けず、Secretsパネルに入れてある
  • [ ] 公開したアプリがどのGeminiキーを使うか、アクセスが集中した日にいくらかかるかを把握している
  • [ ] Firestoreやデータベースのルールを見直し、訪問者が読み書きすべきでないデータに触れられないようにしてある
  • [ ] スマートフォン幅の画面で動作確認した
  • [ ] リポジトリをGitHubに同期し、AI Studio以外にもコピーがある
  • [ ] Starter Tierの対象かどうかを確認した、または請求が有効なCloudプロジェクトを用意してある

AIが作ったアプリは、入力検証やアクセス制御に抜けがあっても、一見完成しているように見えることがあります。この点はウェブサイトにおけるバイブコーディングの信頼性ギャップで取り上げています。

Buildモードが向かないケース

Buildモードは、プロトタイプ、社内ツール、Geminiを呼び出す小さなインタラクティブアプリに向いています。一方、独自ドメイン、お問い合わせフォーム、検索での見つけやすさが必要な通常のビジネスサイトには、手間のかかる方法です。また、ai.studioサブドメインの背後にあるCloud Runサービスは、検索向けに管理するサイトとは別物です。よりシンプルなホスティング先を検討しているなら、Google Sitesの代替サービスの一覧をご覧ください。サイトを公開したら、Google Search Consoleを設定して、インデックスの状況を確認できるようにしましょう。

カスタムアプリではなく通常のサイトを作るなら、We.Incの無料プランでは、用意されたテンプレートから最大3つのサイトを公開できます。プロンプトからサイトの下書きを作るAIビルダーは、月額$20のStarterプランから利用できます。こちらからサインアップできます。

無料で始める · クレジットカード不要

Umair Ali Sadaqat

We.Inc創業者

UmairはWe.Incの創業者です。AIによるウェブサイト制作、制作会社、ウェブ制作スタジオの経営について執筆しています。

素晴らしいものを作る準備はできましたか？

立ち上げ、成長、自動化のすべてを1つのプラットフォームで行う15,000+社がWe.Incを利用しています。

無料で始める

クレジットカード不要 · 営業担当に相談する

関連: ブログ｜デジタルマーケティングと集客のヒント

製品

ご利用いただける方

機能

リソース

会社情報

サイトマップを見る