GitHub Copilotでセマンティックモデルアプリを作成してください

このレシピを使って、GitHub Copilot エージェントモードでセマンティックモデルに接続した分析アプリを作成します。 Copilotはデータアプリのテンプレートをスキャフォールドし、Fabricセマンティックモデルコネクタを追加し、DAXクエリや可視化を作成し、アプリの検証を行います。

データアプリのテンプレートは、Fabric認証、DAX生成ガイダンス、ビジュアルコンポーネント、ブラウザ検証を提供します。 コネクターはFabric Appsクライアントを通じて委任されたセマンティックモデルアクセスを提供します。 詳細については、「 セマンティック モデルに接続されたアプリを作成する」を参照してください。

このチュートリアルでは、次の操作を行います。

  • GitHub Copilotをエージェント駆動開発に備えましょう。
  • Copilot に質問にデータアプリのテンプレートをスキャフォールドしてもらいましょう。
  • アプリをセマンティックモデルに接続します。
  • インタラクティブな営業パフォーマンスエクスプローラーを構築しましょう。
  • 生成された変更を確認し、検証してください。
  • アプリをFabricにデプロイしてください。
  • デプロイメントを確認してアプリを開きます。

前提条件

  • Node.js 20 以降。
  • Visual Studio Code。
  • GitHub Copilot Visual Studio Codeでエージェントモードが利用可能です。
  • GitHub CopilotにアクセスできるGitHub アカウント。
  • Fabric にアクセスできる Microsoft アカウント。
  • 共同作成者、メンバー、または管理者のアクセス許可を持つFabric ワークスペース。
  • テナント向けにFabricアプリのワークロードを有効にしました。
  • セマンティック モデル実行クエリ REST API テナント設定が有効になっています。
  • FabricやPower BIの容量でホストされるセマンティックモデル上で権限を構築・読み取りします。
  • セマンティックモデルのワークスペースIDとアイテムID。

Note

Copilotはターミナルコマンドを実行する前に承認を求めます。 また、Rayfin CLIが要求した際には、インタラクティブなブラウザでのサインインも完了しなければなりません。

GitHub Copilot エージェント モードを開く

  1. Visual Studio Codeを開く。
  2. Copilotでプロジェクトを作成させたい親フォルダを開きます。
  3. チャットを開きます。
  4. エージェント モードを選択します。
  5. エージェントが端末と作業スペースにアクセスできるか確認してください。

Copilotに検査や改変を望まない無関係なファイルが入ったフォルダは開かないでください。

データアプリをスキャフォールドする

以下のプロンプトをCopilot Chatにコピーしてください:

Set up a new Fabric data app for me, end to end.

Create the project in a folder named sales-insights. Before changing code, read any
copilot-instructions.md files and agent guidance included in the scaffolded project.

Do the work yourself instead of only printing instructions:
1. Run `npm create @microsoft/rayfin@latest -- "sales-insights" --template dataapp --workspace <workspace-name>`.
2. In the scaffolded project, run `npx rayfin connector add --type fabric-semanticmodel --workspace-id <workspace-id> --item-id <semantic-model-item-id> --name salesModel --operations executeQuery`.
3. Run the version-matched npm install command printed by the connector command.
4. Open and inspect the scaffolded project. Explain the data app template's DAX query,
   visualization, data grid, theme, and browser-validation patterns.
5. Configure the template to use ConnectorsRayfinClient, the generated salesModel
   schema, and the fabricSemanticModel() runtime. Don't retain or add a direct
   Execute Queries REST API client.
6. If authentication is required, run `npx rayfin login` and pause while I complete
   sign-in.
7. Run the existing build and report any errors.
8. Summarize the scaffolded app and wait for my semantic model requirements.

Ask before making a destructive change or using a force option.

<workspace-name>、<workspace-id>、<semantic-model-item-id>をFabricワークスペースとセマンティックモデルの値に置き換えてください。 Copilot がコマンドを実行するときに各コマンドを承認し、求められたら Rayfin のサインイン フローを完了してください。

Copilot に質問にアプリ作成を依頼してください

アプリの対象者、質問、やり取り、ビジュアライゼーションについて説明してください。 salesModelコネクターはすでにセマンティックモデルを識別しています。

次のプロンプトを営業パフォーマンスエクスプローラーの出発点として使いましょう。 ビジネス要件をモデル内の利用可能なフィールドに合わせて調整してください。

Use the existing salesModel connector to build a sales performance explorer for
sales managers.

Requirements:
- Inspect the generated connector schema and semantic model metadata before editing.
  Use actual table, measure, and column names instead of guessing them.
- Show KPI callouts for the model's revenue, order volume, and margin measures when
  those measures are available.
- Add a time-series chart for sales performance, a bar chart that compares a useful
  business category, and a detailed data grid.
- Add date and category filters, and use the template's cross-highlighting behavior.
- Use the template's DAX generation patterns and visual primitives. Minimize the
  number of DAX queries and don't duplicate queries for the same data.
- Submit DAX with client.connectors.salesModel.executeQuery(), check the returned
  status, and handle success and error results.
- Apply the semantic model's format strings consistently to cards, charts, tooltips,
  and the data grid.
- Include loading, empty, and error states.
- Don't add mock data, embed credentials, or implement a separate authentication flow.
- Preserve the template's Fabric authentication and the semantic model connector.
- Don't add dependencies unless they're necessary.

Before editing, inspect the relevant files and give me a short implementation plan.
Ask me to clarify any model fields that are ambiguous. Then make the changes, run
the existing build, and use the template's browser validation workflow to check the
layout at desktop and mobile sizes. Explain any errors you fix.

Copilot がプロジェクトを編集する前に、Copilot の計画を確認してください。 もしプランが要件に合わない場合は、実施承認前にチャットで修正してください。

生成された変更を確認する

Copilotが作業を終えたら、作業のレビューを依頼してください:

Review the changes you made against every requirement in my previous prompt.

Check for:
- DAX queries that reference fields that aren't in the semantic model.
- Duplicate or unnecessary DAX queries.
- Hard-coded sample data, credentials, access tokens, or a second sign-in flow.
- Formatting that ignores the semantic model's format strings.
- Charts, filters, cross-highlighting, or data grid interactions that don't work.
- Missing loading, empty, or error states.
- TypeScript or build errors.

Fix confirmed issues, run the existing build and browser validation, and summarize
the final behavior.

Visual Studio Code でソース管理の差分を確認してください。 次のことに特に注意してください。

  • salesModelコネクタの設定、生成されたスキーマ、DAXクエリ。
  • rayfin/rayfin.yml 内のサービス構成。
  • package.jsonの新たな依存関係。
  • 認証変更やコネクタをバイパスする直接REST呼び出しなどです。
  • 絶対にコミットしてはいけない秘密や資格。

セマンティックモデルの接続を展開し検証する

Copilot に質問にアプリの展開と接続の確認を依頼してください:

Deploy the app with `npx rayfin up`, then run `npx rayfin up status` and confirm
that the deployment is healthy. Give me the Fabric portal link from the command
output.

Don't add mock data if a semantic model query fails. Check the workspace and model
IDs in the connector configuration, the Semantic Model Execute Queries REST API
tenant setting, my Build and Read permissions, the DAX query, the connector error
result, and the browser console. Report the exact failure and the corrective action.

Fabricポータルからアプリを開き、ライブセマンティックモデルクエリをテストしてください。

アプリを検証する

Copilot に質問にプロジェクトの既存検証を実行するよう依頼してください:

Validate the app without adding new tools.

1. Run the existing build and type-check commands from package.json.
2. Run the template's browser validation at desktop and mobile sizes.
3. Check for clipped charts, unreadable labels, empty visuals, and console errors.
4. Tell me which semantic model queries and user interactions I must verify in the
    Fabric portal.
5. Fix confirmed build, type, or layout errors, and rerun the failed check.

Fabricポータルで、Copilotに提示した受け入れ基準を確認してください。 認証、フィルター、クロスハイライト、データのフォーマット、空状態、エラー処理、そして各ビジュアルの結果をテストします。

完成したアプリをデプロイしてください

変更を確認してアプリのテストを行ったら、Copilotにデプロイを依頼してください:

Deploy the reviewed app to Fabric.

1. Show me the current git diff and summarize what will be deployed.
2. Run `npx rayfin up`.
3. Run `npx rayfin up status`.
4. Confirm that the deployment is healthy.
5. Give me the hosted app URL and Fabric portal link from the command output.

Stop and explain the issue if deployment or verification fails.

同じ npx rayfin up コマンドは、アプリ開発を続ける際に既存のデプロイメントを更新します。

Copilotで反復を続けてください

後の変更には焦点を絞ったプロンプトを使いましょう。 望ましい動作、影響を受けるユーザー、制約、検証ステップを含めてください。

Add a product detail view to the sales performance explorer.

Open the view when a user selects a product in the data grid. Use fields and measures
that exist in the semantic model, reuse existing query results where practical, and
preserve filters and formatting. Run the existing build and browser validation, then
list the interactions and DAX results I should verify in the Fabric portal.

各リクエストは確認できるほど小さく管理してください。 Copilotに大きな変更や破壊的な変更を求める前に、動作状態をコミットしてください。

Copilotのワークフローのトラブルシューティング

Copilotはコマンドのみを印刷します

Copilotにコマンドを実行し、結果を報告するよう指示してください。 チャットが エージェント モードで、端末アクセスが有効になっているかを確認してください。

コマンドはサインインを待機しています

ブラウザのサインインフローを完成させます。 その後、Copilotにサインイン完了を伝えて、続行してください。

Copilotが間違ったフォルダを編集します

エージェントを停止し、Visual Studio Codeのスキャフォールドプロジェクトフォルダを開き、そのワークスペースから新しいチャットを起動します。

展開は成功しますが、セマンティックモデルクエリは失敗します

Copilot に質問にコネクタのワークスペースIDやモデルID、Semantic Model Execute Queries REST APIのテナント設定、ビルドおよび読み取り権限、生成されたDAX、コネクタエラー結果、ブラウザコンソールを確認してもらいましょう。 失敗したクエリをモックデータに置き換えないでください。

Copilotが提案する--force

まずCopilotに破壊的なスキーマ操作を表示するよう要求してください。 データ損失の可能性を理解し承認した場合にのみ --force を受け入れてください。

その他の問題については、「Fabric Appsのトラブルシューティング」を参照してください。