Google AI Studio がフルスタック開発に対応し、クライアントサイドのプロトタイプにとどまらないアプリケーションを構築できるようになりました。サーバーサイド ランタイムを使用すると、シークレットの管理、外部 API への接続、リアルタイムのマルチプレーヤー エクスペリエンスの構築を行うことができます。
サーバーサイド ランタイム
Google AI Studio アプリケーションにサーバーサイド コンポーネント（Node.js）を含めることができるようになりました。この機能には次のような利点があります。
- サーバーサイド ロジックを実行する: クライアントに公開すべきでないコードを実行します。
- npm パッケージにアクセスする: Antigravity エージェントは、広大な npm エコシステムからパッケージをインストールして使用できます。
- シークレットを処理する: API キーと認証情報を安全に使用します。
npm パッケージを使用する
npm install を手動で実行する必要はありません。パッケージを必要とする機能を追加するようエージェントに依頼するだけで、インストールとインポートが処理されます。
例: > 「axios を使用して外部 API からデータを取得する。」
シークレットを安全に管理する
サーバーサイドのコードとシークレット管理により、世界とやり取りするアプリを構築できるようになりました。
Gemini API キー
Gemini API を使用する新しいアプリを作成すると、AI Studio は GEMINI_API_KEY をサーバーサイドのシークレットとして自動的に構成します。手動での設定は必要ありません。この鍵は、[設定] の [シークレット] パネルで確認できます。アプリの Gemini API 呼び出しは、このキーを使用してサーバーサイド コードから行われるため、ブラウザに公開されることはありません。
サードパーティ API キー
その他のサービスについては、API キーを手動で追加できます。
- サードパーティ API: Stripe、SendGrid、カスタム REST API などのサービスに接続します。
- データベース: 外部データベース（Supabase、Firebase、MongoDB Atlas など）に接続して、セッションを超えてデータを保持します。
実際のアプリを構築する際には、API キーを必要とするサードパーティ サービス（Twilio、Slack、データベースなど）に接続する必要があることがよくあります。鍵を手動で追加する手順は次のとおりです。
- シークレットを追加する: Google AI Studio の [設定] メニューに移動し、[シークレット] セクションを探します。
- キーを保存する: API キーまたはシークレット トークンをここに追加します。
- コードでのアクセス: エージェントは、これらのシークレットに安全にアクセスするサーバーサイド コードを記述できます（通常は環境変数を介して）。これにより、クライアントサイドのブラウザにシークレットが公開されることはありません。
必要に応じて、エージェントはチャットにカードを表示し、新しいシークレットが必要な場合や、プロジェクトの環境変数で新しい鍵が検出された場合に、鍵を追加するよう促します。
データベースと認証のための Firebase 統合
Google AI Studio では、Firebase 統合により、アプリにデータベースや認証を簡単に追加できるようになりました。Antigravity エージェントは、次のサービスを自動的にプロビジョニングして設定できます。
- Firestore データベース: 柔軟でスケーラブルな NoSQL クラウド データベースで、クライアントサイドおよびサーバーサイド開発用のデータを保存および同期します。
- Firebase Authentication: 「Google でログイン」フローを使用して、ユーザーがアプリケーションに安全にログインできるようにします。
エージェントに「アプリにデータベースを追加する」または「Google ログインを設定する」と依頼するだけで、必要な構成とコード生成が処理されます。Android アプリをビルドする場合、Firebase 統合により、クライアントサイドの Gemini API 呼び出しを保護するために Firebase AI Logic と Firebase App Check もプロビジョニングされます。
Firebase は無料で使い始めることができます。割り当てを増やしたり、有料機能を使用したりする準備ができたら、有料アカウントにアップグレードできます。
Google Workspace API
Google AI Studio を使用すると、Google Workspace API に接続するアプリを構築できます。これにより、ユーザーはメール、スプレッドシート、ドキュメント、カレンダーの予定などの実際のデータをアプリ内で操作できます。Google Cloud プロジェクトの設定、OAuth の構成、API の手動管理は不要になりました。
仕組み
Workspace の統合を追加するには、次の 2 つの方法があります。
- チャットパネルで説明する: 下部のチャットパネルで、エージェントに希望を伝えるだけです。たとえば、「領収書を Google スプレッドシートに記録する経費トラッカーを作成して」や「未読の Gmail メッセージを要約するダッシュボードを作成して」などです。
- 統合パネルから選択する: ビルドモードの右側のサイドバーにある [統合] パネルを開き、接続する Workspace アプリを有効にします。
Workspace アプリを追加すると、AI Studio は自動的に次の処理を行います。
- アプリに必要な Google API を接続します。
- API を呼び出すサーバーサイド コードを生成します。
- 安全な「Google でログイン」フローを追加して、アプリのエンドユーザーが自身のデータへのアクセスを承認できるようにします。
対応アプリ
次の Google Workspace アプリが利用可能です。
| アプリ | 構築できるもの |
|---|---|
| Google カレンダー | 予定とカレンダーの読み取り、作成、管理 |
| Google Chat | 会話とグループ スペースの読み取りと操作 |
| Google ドキュメント | ドキュメントの作成、読み取り、更新、書式設定 |
| Google ドライブ | ファイルやフォルダを整理、検索、管理する |
| Google フォーム | アンケートの作成、質問の更新、回答の取得 |
| Gmail | メールのコンテンツの読み取り、送信、管理 |
| Google Keep | メモ、リスト、添付ファイルを管理する |
| Google Meet | ビデオ通話のスケジュール設定と管理 |
| 連絡先 | 連絡先を同期、管理する |
| Google スプレッドシート | スプレッドシート データの読み取り、書き込み、書式設定 |
| Google スライド | プレゼンテーションを作成、変更する |
| Google ToDo リスト | タスクを作成、管理、整理する |
認証と権限
ビルダーは、OAuth クライアントの構成、認証情報の管理、Google Cloud プロジェクトの設定を行う必要はありません。AI Studio がすべて処理します。
Workspace API が統合されたアプリは、「Google でログイン」を使用してエンドユーザーを認証します。ユーザーがアプリを開くと、ログインして、アプリに必要な特定の権限（カレンダーへの読み取り専用アクセス権、スプレッドシートの編集権限など）を付与するよう求められます。アプリは、アプリを使用しているユーザーのデータにのみアクセスします。各ユーザーが自分のアカウントへのアクセスを承認します。
プロンプトの例
Workspace 統合を使い始める際のアイデアをいくつかご紹介します。
- 「Google カレンダーを読み取り、各会議の準備メールを Gmail で下書きするアプリを作成して。」
- 「Google ドキュメントを読み込んで、Google スライドで 5 枚のスライドからなる要約プレゼンテーションを生成するツールを作成して。」
- 「領収書をアップロードすると、Gemini が詳細を抽出して Google スプレッドシートに新しい行を記録する、経費トラッカーを作成して。」
OAuth を設定する
シークレット管理の主なユースケースの 1 つは、他のウェブサイトやアプリに接続するための OAuth の設定です。プロンプトに OAuth 認証を必要とするサードパーティ アプリへの接続に関する指示が含まれている場合、エージェントはそのアプリケーションの OAuth を設定する方法を指示します。これらの手順には、OAuth アプリケーションの構成に必要なコールバック URL が含まれています。コールバック URL は、[Settings] パネルの [Integrations] にも表示されます。
マルチプレーヤー エクスペリエンスを構築する
フルスタック ランタイムにより、リアルタイムのコラボレーション機能が有効になります。
- リアルタイムの状態: 「ライブチャット」、「共同作業用ホワイトボード」、「マルチプレーヤー ゲーム」などの機能を構築するようエージェントに指示できます。
- 同期セッション: サーバーが状態を管理し、複数のユーザーが同じアプリケーション インスタンスをリアルタイムで操作できるようにします。
プロンプトの例: > 「これを、プレーヤーがお互いのカーソルを確認できるマルチプレーヤー ゲームにしてください。」
マルチプレーヤー型アプリをテストするためのヒント
アプリをデプロイする前に、マルチプレーヤー モードをテストする方法は 2 つあります。
- Google AI Studio のビルドモードでアプリを複数のタブで開きます。ビルドモードで開発する場合、アプリは開発コンテナにあります。複数のタブでアプリを開くと、複数のプレーヤーがアプリを使用している状況をシミュレートできます。
- 右上の [Share] メニューを使用してアプリを他のユーザーと共有し、[Share] メニューの [Integrations] タブの [Shared URL] を使用して、アプリを共有したプレーヤーとアプリを使用します。
ベスト プラクティス
- Gemini API 呼び出し:
GEMINI_API_KEYは、サーバーサイドのシークレットとして自動的に構成されます。このキーを使用して、サーバーサイド コードから Gemini API 呼び出しを行います。[Secrets] パネルで確認できます。 - シークレットのセキュリティ: 機密性の高い鍵には常に Secrets Manager を使用します。ファイルにハードコードしないでください。
- 関心の分離: UI ロジックはクライアントサイド フレームワーク（React / Angular）に、ビジネス ロジックとデータ処理はサーバーサイドに保持します。
- エラー処理: サーバーサイドのコードで外部 API 呼び出しのエラーを堅牢に処理し、アプリがクラッシュしないようにします。