Google AI Studio がフルスタック開発に対応し、クライアントサイドのプロトタイプにとどまらないアプリケーションを構築できるようになりました。サーバーサイド ランタイムを使用すると、シークレットの管理、外部 API への接続、リアルタイムのマルチプレーヤー エクスペリエンスの構築が可能になります。
サーバーサイド ランタイム
Google AI Studio アプリケーションにサーバーサイド コンポーネント(Node.js)を含めることができるようになりました。 この機能には次のような利点があります。
- サーバーサイド ロジックの実行: クライアントに公開すべきでないコードを実行します。
- npm パッケージへのアクセス: Antigravity Agent は、広範な npm エコシステムのパッケージをインストールして使用できます。
- シークレットの処理: API キーと認証情報を安全に使用します。
npm パッケージを使用する
npm install を手動で実行する必要はありません。パッケージを必要とする機能を追加するようエージェントに指示するだけで、インストールとインポートを処理してくれます。
例: > 「axios を使用して外部 API からデータを取得する」
シークレットを安全に管理する
サーバーサイド コードとシークレット管理により、世界とやり取りするアプリを構築できるようになりました。
- サードパーティ API: Stripe、SendGrid、カスタム REST API などのサービスに接続します。
- データベース: 外部データベース(Supabase、Firebase、 MongoDB Atlas など)に接続して、セッションを超えてデータを保持します。
実際のアプリを構築する場合、API キーを必要とするサードパーティ サービス(Twilio、Slack、データベースなど)に接続する必要があることがよくあります。次の手順でキーを手動で追加できます。
- シークレットを追加する: Google AI Studio の [設定] メニューに移動し、 [Secrets] セクションを探します。
- キーを保存する: API キーまたはシークレット トークンをここに追加します。
- コードでアクセスする: エージェントは、これらの シークレットに安全にアクセスするサーバーサイド コード(通常は環境変数経由)を記述できます。これにより、シークレットが クライアントサイド ブラウザに公開されることはありません。
必要に応じて、エージェントはチャットにカードを表示し、新しい Secret が必要な場合や、プロジェクトの環境変数で新しいキーが検出された場合に、キーを追加するように求めます。
データベースと認証のための Firebase との統合
Google AI Studio では、Firebase との統合により、データベースや認証をアプリに簡単に追加できるようになりました。Antigravity Agent は、次のサービスを自動的にプロビジョニングして設定できます。
- Firestore データベース: クライアントサイド開発とサーバーサイド開発のデータを保存、同期するための、柔軟でスケーラブルな NoSQL クラウド データベースです。
- Firebase Authentication: ユーザーが [Google でログイン] フローを使用して アプリケーションに安全にログインできるようにします。
エージェントに「アプリにデータベースを追加する」または「Google ログインを設定する」と指示するだけで、必要な構成とコード生成を処理してくれます。
Firebase は無料で開始できます。割り当てを増やしたり、有料機能を使用したりする準備ができたら、有料アカウントにアップグレードできます。
OAuth を設定する
シークレット管理の主なユースケースの 1 つは、OAuth を設定して他のウェブサイトやアプリに接続することです。プロンプトに、OAuth 認証を必要とするサードパーティ アプリに接続する手順が含まれている場合、エージェントはそのアプリケーションの OAuth を設定する方法の手順を提供します。これらの手順には、OAuth アプリケーションを構成するために必要なコールバック URL が含まれます。 コールバック URL は、[設定] パネルの [Integrations] でも確認できます。
マルチプレーヤー エクスペリエンスを構築する
フルスタック ランタイムでは、リアルタイムのコラボレーション機能を使用できます。
- リアルタイムの状態: エージェントに「ライブ チャット」、「共同ホワイトボード」、「マルチプレーヤー ゲーム」などの機能の構築を依頼できます。
- セッションの同期: サーバーが状態を管理するため、複数のユーザー が同じアプリケーション インスタンスをリアルタイムで操作できます。
プロンプトの例: > 「プレーヤーが互いのカーソルを確認できるマルチプレーヤー ゲームにする」
マルチプレーヤー アプリをテストする際のヒント
アプリをデプロイする前に、次の 2 つの方法でマルチプレーヤー モードをテストできます。
- Google AI Studio のビルドモードでアプリを複数のタブで開きます。ビルドモードで開発する場合、アプリは開発コンテナにあります。アプリを複数のタブで開くと、アプリを使用している複数のプレーヤーをシミュレートできます。
- 右上の [共有] メニューを使用して、アプリを他のユーザーと共有します。次に、[共有] メニューの [Integrations] タブの [Shared URL] を使用して、アプリを共有したプレーヤーとアプリを使用します。
ベスト プラクティス
- シークレットのセキュリティ: 機密性の高いキーには常に Secrets Manager を使用します。 ファイルにハードコードしないでください。
- 関心の分離: UI ロジックはクライアントサイド フレームワーク (React / Angular)に、ビジネス ロジックとデータ処理はサーバーサイドに保持します。
- エラー処理: サーバーサイド コードで外部 API 呼び出しからのエラーを確実に処理し、アプリがクラッシュしないようにします。