このページは Cloud Translation API によって翻訳されました。

Data Connect で AI アシスタントを使用する

Gemini in Firebase を使用して、クライアントサイドコードのスキーマ、クエリ、ミューテーションを作成します。

アプリ、データモデル、目的のクエリまたはミューテーションを自然言語で記述すると、Firebase の Gemini が Data Connect の同等のものを生成します。

この AI 支援は、次の開発コンテキストで利用できます。

Firebase コンソールでは、スキーマとオペレーションを生成、テスト、デプロイできます。
ローカル環境では、Firebase CLI と Data Connect VS Code 拡張機能を使用して、エミュレータでアプリの生成、テスト、開発を行うことができます。
AI を搭載した開発ツールは、Firebase MCP サーバーを使用してアプリの生成、テスト、開発を行うことができます。

Data Connect スキーマ、クエリ、ミューテーションの構文について詳しくは、ガイドをご覧ください。

AI assistance for Data Connect によるデータの使用方法

詳しくは、Gemini in Firebase がデータを使用する方法をご覧ください。

AI assistance for Data Connectを設定

Data Connect で AI アシスタンスを使用するには、Gemini in Firebase を設定するで説明されているように Gemini in Firebase を有効にします。

Gemini in Firebase でスキーマ、クエリ、ミューテーションを生成する

多くのワークフローで Data Connect に AI アシスタンスを使用できます。

Firebase コンソールで

Data Connect サービスを作成すると、Firebase コンソールに「Gemini のスタートガイド」が表示されます。

アプリのアイデアを説明すると、AI アシスタントが次のものを生成します。

アプリのアイデアに基づく完全なスキーマ。
オペレーションとデータ変更の例。

データページで、[GraphQL の作成を支援] pen_spark ボタンを使用して、自然言語に基づいてオペレーションを生成して実行できます。ユースケースの例をご覧ください。

このワークフローについては、スタートガイドをご覧ください。デプロイされたスキーマとオペレーションを使用して、ローカル開発環境で作業を続行できます。

ローカル環境の場合

Firebase CLI と Data Connect VS Code 拡張機能から AI アシスタンスを利用することもできます。

firebase init dataconnect にアプリのアイデアを提供すると、次のものが生成されます。

アプリのアイデアに基づく完全なスキーマ。
オペレーションの例とシードデータのミューテーション。

Data Connect VS Code 拡張機能には次の機能があります。

オペレーションコードレンズの生成/絞り込み: GraphQL コメントを Data Connect オペレーションに変換します。
Gemini Code Assist および Firebase MCP サーバーとのシームレスな統合。

このワークフローについては、ローカルプロトタイピングのスタートガイドをご覧ください。

AI を搭載した開発ツールで Firebase MCP サーバーを使用する

Firebase MCP サーバーは、Gemini CLI、Gemini Code Assist、Cursor、Visual Studio Code Copilot、Claude Desktop、Windsurf Editor など、MCP クライアントとして機能できる任意の AI アシスタントツールと連携できます。

Firebase MCP サーバーは、AI を搭載した開発ツールが Data Connect をより効果的に操作できるように、追加のコンテキストと機能を提供します。次のことができます。

新しいプロジェクトディレクトリと生成された SDK を設定します。
コンパイルエラーに基づいてスキーマとオペレーションを構築して反復処理します。
要件に基づいて新しいスキーマとオペレーションを生成します。
ローカルエミュレータまたはバックエンドサービスに対してオペレーションを生成して実行します。
既存のサービスに関する情報を収集します。

Firebase MCP サーバーを使用するには:

このガイドに沿って MCP クライアントを設定します。
Data Connect に関するサポートをリクエストします。プロンプトの例:
1. 「ピザ配達アプリの Data Connect プロジェクトを設定して。」
2. 「Data Connect コンパイルエラーを修正」
3. 「ホームページに、アクティブなチャットルームとフレンドリストを表示する必要があります。Data Connect クエリを生成します。」
4. 「ローカル Data Connect エミュレータにどのユーザーがいますか？」
5. 「Data Connect サービスはどの Google Cloud リージョンにありますか？」

オペレーション生成のユースケースの例

以降のセクションでは、ユースケースの例について説明します。

評価の高い上位 5 つの映画を降順で返す
ユーザー入力に基づいてデータベースに映画を追加するミューテーションを作成する
ユーザーが指定したジャンルと評価に基づいてレビューを一覧表示するクエリを作成する

評価の高い上位 5 本の映画を降順で返す

AI assistance for Data Connect を使用して自然言語に基づいて GraphQL を生成するには:

プロジェクトで Data Connect を開き、[サービス] でデータソースを選択します。
[データ] をクリックします。
[GraphQL の作成を支援] pen_spark アイコンをクリックします。生成するクエリまたはミューテーションを自然言語で記述し、[生成] をクリックします。

たとえば、「Data Connect (web) Codelab でビルドする」で参照されている映画データソースを使用している場合に、「2022 年の上位 5 本の映画を評価の降順で返す」と尋ねると、次のような結果が返されます。
```
query TopMovies2022 {
  movies(where: {releaseYear: {eq: 2022}}, orderBy: [{rating: DESC}], limit: 5) {
    id
    title
    rating
    releaseYear
  }
}
```
回答を確認します:
- 回答が正しいと思われる場合は、[挿入] をクリックして、回答をコードエディタに挿入します。
- 回答を改善できる場合は、[編集] をクリックしてプロンプトを更新し、[再生成] をクリックします。
回答を承認したら、必要に応じて [パラメータ] セクションで次の設定を行います。
- 変数: クエリまたはミューテーションに変数が含まれる場合は、ここで定義します。JSON を使用して定義します（例: {"title":"The Matrix", "releaseYear":"1999"}）。
- 認可: クエリまたはミューテーションを実行する認可コンテキスト（管理者、認可済み、未認可）を選択します。
警告: ミューテーションを実行する場合は、実行する前に慎重に確認してください。データエディタでミューテーションを実行すると、リクエストが実行されます。
コードエディタで [実行] をクリックして、結果を確認します。

コードエディタで複数のクエリまたはミューテーションをテストするには、名称が付けられていることを確認します。たとえば、次のクエリの名称は GetMovie です。クエリまたはミューテーションの最初の行にカーソルを移動して、[実行] ボタンを有効にします。

query GetMovie($myKey: Movie_Key!) {
  movie(key: $myKey) { title }
}

ユーザー入力に基づいてデータベースに映画を追加するミューテーションを作成する

この例では、自然言語を使用してデータベースにデータを入力する GraphQL ミューテーションを生成する方法を示します。この例では、Firebase Data Connect ドキュメントと「Data Connect（ウェブ）Codelab でビルドする」で使用されている映画データベーススキーマを使用していることを前提としています。

Firebase コンソールで、Data Connect を開きます。
サービスとデータソースを選択し、[データ] タブを開きます。
[GraphQL の作成を支援] pen_spark アイコンをクリックして、ミューテーションを記述します。
```
Create a movie based on user input.
```

[生成] をクリックします。ミューテーションが返されます。たとえば、Gemini は次のようなミューテーションを返すことがあります。

mutation CreateMovie($title: String!, $releaseYear: Int!, $genre: String!, $rating: Float!, $description: String!, $imageUrl: String!, $tags: [String!] = []) @auth(level: USER) {
  movie_insert(data: {
    title: $title,
    releaseYear: $releaseYear,
    genre: $genre,
    rating: $rating,
    description: $description,
    imageUrl: $imageUrl,
    tags: $tags
  })
}

出力を確認します。必要に応じて、[編集] をクリックしてプロンプトを絞り込み、[再生成] をクリックします。
次に、[挿入] をクリックして、ミューテーションをデータエディタに挿入します。

ミューテーションを実行するには、変数が必要です。[Parameters] セクションで [Variables] を開き、テスト変数を含めます。

{"title":"My amazing movie", "releaseYear":2024, "genre": "Comedy",
"rating": 8, "description": "A new movie to test mutations",
"imageUrl": "", "tags": ["comedy","space travel"]}

[実行] をクリックします。

ヒント: Gemini に出力結果を拡張するようリクエストすることもできます。たとえば、コメントとソースプロンプトを出力に含めるには、「ユーザーの入力に基づいて映画を作成します。変更を記録し、このプロンプトを回答に含めてください。」

次に、映画が追加されたことを確認するクエリを作成します。[GraphQL の作成を支援] pen_spark をクリックし、表示されたボックスにプロンプトを入力します。

List all movies from 2024 that include all of these tags: 'space travel', 'comedy'.

Gemini から次のようなレスポンスが返されることがあります。

query ComedySpaceTravelMovies2024 @auth(level: PUBLIC) {
  movies(
    where: {
    releaseYear: { eq: 2024 },
    tags: { includesAll: ["space travel", "comedy"] }
    }
  ) {
      id
      title
      imageUrl
      releaseYear
      genre
      rating
      description
      tags
    }
}

クエリを挿入して実行します。追加した映画が [履歴] フィールドに表示されます。

ユーザーが指定したジャンルと評価に基づいてレビューを一覧表示するクエリを作成する

この例では、自然言語を使用して GraphQL クエリを生成する方法を示します。この例では、 Firebase Data Connect ドキュメントと「Data Connect（ウェブ）Codelab でビルドする」で使用されている映画データベースを使用していることを前提としています。

Firebase コンソールで、Data Connect を開きます。
サービスとデータソースを選択し、[データ] タブを開きます。
[GraphQL の作成を支援] pen_spark アイコンをクリックして、クエリを説明します。
```
List all movie reviews, based on user-configurable genre and ratings.
```

[生成] をクリックします。クエリが返されます。たとえば、Gemini は次のようなクエリを返すことがあります。

query ListReviewsByGenreAndRating($genre: String, $minRating: Int, $maxRating: Int) @auth(level: PUBLIC) {
  reviews(where: {
    movie: {
      genre: {eq: $genre}
    },
    rating: {ge: $minRating, le: $maxRating}
  }) {
    id
    user {
      username
    }
    movie {
      title
      genre
    }
    rating
    reviewText
    reviewDate
  }
}

出力を確認します。必要に応じて、[編集] をクリックしてプロンプトを絞り込み、[再生成] をクリックします。
次に、[挿入] をクリックして、ミューテーションをデータエディタに挿入します。
このクエリをテストするには、変数が必要です。[パラメータ] セクションで [変数] を開き、テストに使用する変数を含めます。
```
{"genre":"sci-fi", "minRating":4, "maxRating":9}
```
[実行] をクリックします。

サードパーティの AI アシスタンスツール用のプロンプトを設計する

他の AI アシスタントツールと同様に、プロンプトの質が高いほど、より有用な出力が得られます。

Firebase の Gemini に自然言語プロンプトを指定すると、アシスタントは入力されたプロンプトをより完全に開発されたプロンプトに変換します。

Cursor や Windsurf などのサードパーティの AI ツールを使用している場合は、同様のより詳細なプロンプトを使用することで、より適切な Data Connect の推奨事項を取得できます。

ダウンロード、適応、IDE へのコピーが可能なプロンプトテンプレートを公開しました。

スキーマ生成用のテンプレートプロンプト
オペレーション生成用のテンプレートプロンプト

ダウンロードして変更したら、次のように、使い慣れたツール（Cursor や Windsurf など）でプロンプトを作成します。

Cursor の場合（必ず Cursor の最新の手順をご確認ください）:
1. 右上の設定アイコンをクリックします。
2. [ルール] タブを選択します。
3. [Project Rules] で、[Add a new rule] ボタンをクリックします。
4. ルールをコピーして貼り付けます。
Windsurf で（必ず Windsurf の最新の手順を確認してください）:
1. 右上にある [カスケード] ボタンをクリックして、カスケードウィンドウを開きます。
2. Cascade の右上のスライダーメニューにある [カスタマイズ] アイコンをクリックし、[ルール] パネルに移動します。
3. [+ Global] ボタンまたは [+ Workspace] ボタンをクリックして、それぞれグローバルレベルまたはワークスペースレベルで新しいルールを作成します。
4. ルールをコピーして貼り付けます。

AI assistance for Data Connect のトラブルシューティング

Gemini in Firebase のトラブルシューティングをご覧ください。

料金

AI assistance for Data Connect は Gemini in Firebase の一部として提供されており、個人ユーザーは無料で利用できます。

詳細については、Gemini in Firebase の料金をご覧ください。

次のステップ

スキーマ、クエリ、ミューテーションについて詳しくは、こちらをご覧ください。
詳しくは、Gemini in Firebase をご覧ください。