GitHub Copilot CLI と Claude Code 向けの Power Pages プラグインを使い始める

GitHub Copilot CLI と Claude Code 用の Power Pages プラグインは、Power Pages 上の最新のシングルページアプリケーション (SPA) サイトを作成、デプロイ、および管理するための AI 支援ワークフローを提供します。プロジェクトを手動でスキャフォールディングしたり、定型 API コードを記述したり、アクセス許可を構成したりするのではなく、自然言語で必要なものを記述し、プラグインが実装を処理します。

このプラグインは、新しいサイトのスキャフォールディングからデプロイ、Dataverse データモデルの設定、認証の構成まで、会話スキルを通じて完全なサイト開発ライフサイクルをサポートします。

Important

GitHub Copilot CLI や Claude Code などの生成 AI コーディングエージェントは、このプラグインのスキルとワークフローを使用して、Power Pages固有のタスクを完了します。
AI コーディングエージェントによって生成されたコードと構成が不正確になる可能性があります。生成されたすべてのコンテンツを承認またはデプロイする前に、確認、テスト、検証します。エージェントの提案を承認する前に、必ず確認してください。

前提条件

開始する前に、必要なソフトウェアとアクセス許可があることを確認します。

ソフトウェア要件

コンポーネント	最小バージョン	詳細情報
Node.js	18.0 以降	Node.jsをダウンロードする
Power Platform CLI (PAC CLI)	2.6.3 以降 (サーバーロジックに必要)	PAC CLI のインストール
Azure CLI	最新	Azure CLI のインストール
GitHub Copilot CLI または Claude Code	最新	GitHub Copilot CLI または Claude Code
Visual Studio Codeおよび Power Platform Tools 拡張機能（オプション）	最新	VS Code をダウンロードして Power Platform Tools をインストールする

以下も必要です。

Power Pages が有効になっている Power Platform 環境。
ターゲット環境に接続されている認証済みの PAC CLI セッション。まだ接続していない場合は、 pac auth create を実行します。
同じテナントにサインインしている Azure CLI セッション。 az login --allow-no-subscriptions を実行して認証します。

認証確認:

pac auth list コマンドを使用して認証されていることを確認します。

pac auth list           # Should show authenticated profile

認証されていない場合は、次のコマンドを実行します。

pac auth create --environment <Instance url>        # Authenticate to Power Platform

Tip

インスタンスの URL を取得するには、Power Pages ホームに移動し、右上隅にある [設定] アイコンを選択し、[セッションの詳細] を選択します。

プラグインをインストールする

マーケットプレースから Power Pages プラグインをインストールします。 GitHub Copilot CLI を使用する場合、同等のインストール手順については、Copilot CLI 拡張機能のドキュメントを参照してください。次のコマンドでは、Claude Code 構文を使用します。

クイックインストール (推奨)

インストーラーを実行して、autoupdate が有効になっているすべてのプラグインを設定します。

Windows (PowerShell):

iwr https://raw.githubusercontent.com/microsoft/power-platform-skills/main/scripts/install.js -OutFile install.js; node install.js; del install.js

macOS/Linux/Windows (cmd):

curl -fsSL https://raw.githubusercontent.com/microsoft/power-platform-skills/main/scripts/install.js | node

インストーラーは自動的に次の手順を実行します。

pac CLI がまだインストールされていない場合はインストールします。
Claude Code や GitHub Copilot CLI などの使用可能なツールを検出します。
プラグインマーケットプレースを登録し、表示されているすべてのプラグインをインストールします。
プラグインが最新の状態に保たることができるように、自動更新を有効にします。

インストール後、Claude Code または GitHub Copilot CLI を再起動して、エージェントセッションでスラッシュコマンドとしてプラグインのスキルにアクセスします。

Marketplace からインストールする

ターミナルで Claude Code を開きます。

Microsoft Marketplace を追加します。

/plugin marketplace add microsoft/power-platform-skills

Power Pages プラグインをインストールします。
```
/plugin install power-pages@power-platform-skills
```

プラグインをインストールしたら、Claude Code を再起動するか、GitHub Copilot CLI を再起動して、エージェントセッションでプラグインのスキルをスラッシュコマンドとして利用できます。

Tip

マーケットプレースとスキルの更新プログラムを自動的に受信するには、自動更新を有効にします。 /pluginコマンドを使用し、Marketplace に移動し、マーケットプレースを選択して、自動更新を有効にします。

スキルの概要

このプラグインは、Power Pages サイトのライフサイクル全体をカバーするスキルを提供します。スラッシュコマンドとして、または実行する内容を記述して、各スキルを会話形式で呼び出します。

スキル	命令	動作内容
サイトの作成	`/create-site`	サイトの基礎構築を行い、デザイン指針を適用し、ページやコンポーネントを作成します。
サイトをデプロイ	`/deploy-site`	PAC CLI を使用してプロジェクトをビルドし、Power Pagesにアップロードする
サイトのアクティブ化	`/activate-site`	Web サイトレコードをプロビジョニングし、パブリック URL を割り当てます
データモデルを設定する	`/setup-datamodel`	Dataverse テーブル、列、リレーションシップを作成します
サンプルデータを追加する (省略可能)	`/add-sample-data`	Dataverse テーブルに実際的なテストレコードを入力します
Web API の統合	`/integrate-webapi`	型指定された API クライアントコード、サービス、およびテーブルのアクセス許可を生成します
AI の概要を追加する	`/add-ai-webapi`	生成 AI 要約 API (検索の概要とデータの要約) をページに統合します。偽造防止トークン処理、フレームワーク固有ラッパー、ワイヤード (有線) 呼び出しサイト、および一致する `Summarization` サイト設定を使用して、型指定された概要サービスを生成します
認証の設定	`/setup-auth`	サインイン、サインアウト、ロールベースのアクセス制御を追加します。 Microsoft Entra ID、Microsoft Entra 外部 ID、OpenID Connect、SAML 2.0、WS-Federation、Microsoft アカウント、Facebook、Google、ローカルユーザー名とパスワードの認証 (マルチプロバイダー構成を含む) をサポートします
Web ロールを作成する	`/create-webroles`	ユーザーアクセス管理用の Web ロール YAML ファイルを生成します
サーバーロジックの追加	`/add-server-logic`	検証、外部 API 呼び出し、シークレット管理、データ操作用のセキュリティで保護されたサーバー側 JavaScript エンドポイントを生成します
クラウドフローの追加	`/add-cloud-flow`	承認ワークフロー、通知、スケジュールされた自動化のために、既存のPower Automate クラウドフローをサイトに統合します
バックエンドの統合	`/integrate-backend`	プロトタイプを分析し、各機能の適切なアプローチ (Web API、サーバーロジック、またはクラウドフロー) を決定し、完全なビルドシーケンスを調整します
SEO を追加する	`/add-seo`	robots.txt、sitemap.xml、およびメタタグを生成します
セキュリティレビューを実行する	`/security-review`	焦点を絞ったセキュリティスキルを調整し、すべての結果を 1 つの HTML レポートに統合します。コード、依存関係、配置サイトスキャン、ブラウザーヘッダー、Web アプリケーションファイアウォール、テーブルのアクセス許可、認証の構成について説明します
ソースコードをスキャンする	`/scan-code`	ローカルソースファイルに対して静的分析と依存関係スキャンを実行します。コードパターン、脆弱なパッケージ、ハードコーディングされたシークレット、ライセンスの問題にまたがって結果を表示する
展開されたサイトをスキャンする	`/scan-site`	ライブサイトに対してサーバー側のセキュリティスキャンを開始し、最新のレポートをフェッチし、重大度別に結果をグループ化します
ブラウザーのセキュリティヘッダーを管理する	`/manage-headers`	サイトがブラウザーに送信する HTTP セキュリティヘッダー (コンテンツセキュリティポリシー、フレームとクリックジャッキング保護、クロスオリジン共有、Cookie の動作、および関連するサイト設定) を検査して構成します。
Web アプリケーションファイアウォールを管理する	`/manage-firewall`	運用サイトで Web アプリケーションファイアウォール (WAF) を検査して構成します。保護を有効にし、IP ブロック、国ブロック、パスブロック、レート制限を追加または削除します
テーブルの権限を監査する	`/audit-permissions`	サイトコードと Dataverse メタデータに対する既存のテーブルのアクセス許可を監査します。は、推奨される修正プログラムを含む重大度別にグループ化された HTML レポートを生成します
展開の計画	`/plan-alm`	プロジェクトの状態を検出し、プロモーション戦略を収集し、視覚的な計画をレンダリングし、適切な順序で他のアプリケーションライフサイクル管理 (ALM) スキルを調整します
ソリューションを作成	`/setup-solution`	パブリッシャーとソリューションを作成し、Power Pagesコンポーネントを追加し、サイト設定を分類し、環境変数とAzure Key Vaultシークレットを提案します
パイプラインホストを設定する	`/ensure-pipelines-host`	Power Platform Pipelines のホスト環境をプロビジョニングまたは検出する
パイプラインを設定する	`/setup-pipeline`	Dataverse にパイプライン定義を登録し、昇格ステージをターゲット環境にバインドします
パイプラインを使用したデプロイ	`/deploy-pipeline`	ステージごとの環境変数のオーバーライドを使用してターゲットステージのパイプラインデプロイをトリガーします
強制リンク環境	`/force-link-environment`	ホストの競合によってデプロイがブロックされたときに、ターゲット環境を新しい Power Platform Pipelines ホストに再割り当てする
ソリューションのエクスポート	`/export-solution`	ソリューションをマネージド ZIP またはアンマネージド zip としてエクスポートし、エクスポート前に完全性チェックを行います
ソリューションのインポート	`/import-solution`	ターゲット環境 (ステージングまたはダイレクト) にソリューション zip をインポートします
テストサイト	`/test-site`	ブラウザーベースのテスト (ページクロール、ロールベースのアクセスチェック、Web API 検証) を使用して、展開されたサイトを検証します
展開を診断する	`/diagnose-deployment`	既知のエラーのカタログに対して展開エラーを照合し、修正プログラムを提案します

一般的なワークフロー

一般的なエンドツーエンドのワークフローは、次の順序に従います。

/create-site : ページの組み立て、デザイン、および構築
/deploy-site: Power Pages環境にアップロードします
/activate-site : パブリック URL を設定する
/setup-datamodel : Dataverse テーブルを作成する
/add-sample-data : テストレコードをテーブルに挿入する
/integrate-webapi : API クライアントコードを生成し、アクセス許可を構成する
/create-webroles: アクセスロールを定義する
/setup-auth : サインイン、サインアウト、ロールベースの UI の追加
/add-server-logic : セキュリティで保護されたサーバー側エンドポイントを追加する
/add-cloud-flow: 既存のPower Automate フローを統合する
/add-seo : 検索エンジンの最適化
/deploy-site : 最終的な変更をライブにプッシュする
/security-review : 運用環境に移行する前にエンドツーエンドのセキュリティレビューを実行する
/plan-alm : サイトをテスト環境と運用環境に昇格させる

Tip

この正確な順序に従う必要はありません。各スキルは、独自の前提条件を確認し、何かが不足しているかどうかを示します。たとえば、サイトで最初に認証が必要な場合は、/setup-authする前に/integrate-webapiを実行できます。
機能ごとに使用する方法がわからない場合は、手順 4 から 10 を個別に実行するのではなく、 /integrate-backend を実行します。プロトタイプを分析し、各機能に Web API、サーバーロジック、またはクラウドフローが必要かどうかを判断し、正しい順序でスキルを調整します。
AI によって生成された検索とレコードの概要を追加するには、/add-ai-webapi後に/integrate-webapiを実行します。これは、/integrate-webapi が構成するテーブルのアクセス許可とサイト設定を再利用するため、Web API 統合の準備が整ってから実行してください。

Power Pages サイトを構築する

このチュートリアルでは、スキャフォールディングからデプロイまで、プラグインを使用してPower Pages サイトを構築する完全なライフサイクルについて説明します。各ステップでは、あなたが言うこととプラグインが応答して何をするかについて説明します。

手順 1: サイトを作成する

自然言語で必要なサイトについて説明します。その目的、必要なページ、配色、レイアウトスタイル、フォントなどのデザイン設定について説明します。 /create-site実行するか、サイトを記述するだけで、プラグインが意図を認識します。

フレームワークを指定しない場合、プラグインからフレームワークを選択するように求められます (React、Vue、Angular、または Astro)。

テンプレートからプロジェクトをスキャフォールディングし、サイト名、色、デザイントークンを適用します。
依存関係をインストールし、開発サーバーを起動し、ライブブラウザープレビューを開きます。
関連するイメージで要求した各ページ、コンポーネント、ルートをビルドします。
ロールバック履歴が組み込まれるように、重要なマイルストーンで Git コミットを作成します。

手順 2: サイトを展開する

/deploy-siteを実行してサイトを Power Pages にアップロードします。プラグイン:

PAC CLI がインストールされ、認証セッションがアクティブであることを確認します。
先に進む前に、ターゲット環境を確認します。
実稼働ビルドを実行し、コンパイルされた出力をアップロードします。
まだ存在しない場合は、デプロイ成果物ディレクトリを作成します。

Note

環境で特定の添付ファイルがブロックされている場合、プラグインは問題を検出し、問題を解決するための手順を提供します。

手順 3: サイトをアクティブ化する

/activate-siteを実行して、サイトにパブリックにアクセスできるようにします。プラグイン:

サイト名に基づいてサブドメインを提案し、カスタマイズできます。
Power Platform API を使用して Web サイトレコードをプロビジョニングします。
サイトが公開され、公開用 URL が返されるまでの間、投票を実施します。

この時点で、パブリック URL に作業サイトがあります。残りの手順では、データ、認証、および SEO を追加します。サイトに適用されない手順はスキップします。

手順 4: データモデルを設定する

/setup-datamodelを実行して、サイトに必要な Dataverse テーブルを作成します。既に ER 図または特定のスキーマがある場合は、エージェントにコードを分析してもらうのではなく、直接指定します。

このプラグインは、データモデルアーキテクト エージェントを起動します。

サイトのコードを分析して、ページとコンポーネントに必要なデータを決定します。
データバース環境で既存のテーブルに対してクエリを実行し、重複を回避します。
テーブル、列、データ型、リレーションシップを持つデータモデルを ER ダイアグラムとして視覚化して提案します。

提案を確認して承認します。 プラグインでは、確認するまで何も作成されません。承認後、プラグインは API 呼び出しを通じてテーブルと列を作成し、手順 5 と 6 で使用するマニフェストファイルを保存します。

手順 5: サンプルデータを追加する (省略可能)

/add-sample-dataを実行して、テーブルにテストレコードを設定します。この手順では、手順 4 のデータモデルが必要です。

プラグインは、次のアクションを実行します。

マニフェストを読み取って、テーブル、列、およびリレーションシップを理解します。
現実的な電子メール、妥当な日付、書式設定された通貨額など、列の種類ごとにコンテキストに応じて適切な値を生成します。
依存関係の順序 (子テーブルの前の親テーブル) でレコードを挿入し、一括挿入時に認証トークンを自動的に更新します。

手順 6: Dataverse Web API と統合する

/integrate-webapiを実行して、モックデータをライブ Dataverse クエリに置き換えます。この手順では、手順 4 のデータモデルが必要です。

プラグインは、次のアクションを実行します。

モックデータ、プレースホルダーフェッチ呼び出し、またはハードコーディングされた配列を使用するコンポーネントのコードベースをスキャンします。これらのコンポーネントは Dataverse テーブルにマップされます。
生成する各テーブルに対して Web API 統合 エージェントを生成します。
- 偽造防止トークン管理と再試行ロジックを備えた共有 API クライアント。
- TypeScript エンティティ型とドメインマッパー。
- CRUD サービスレイヤー。
- React フック、Vue コンポーザブル、Angular サービスなどのフレームワーク固有のパターン。
テーブルのアクセス許可とサイト設定を提案する アクセス許可アーキテクト エージェントを生成します。

アクセス許可の提案を確認して承認します。 確認するまで、プラグインは構成ファイルを作成しません。

AI で生成された概要を追加する (省略可能)

/add-ai-webapiを実行して、Web API 統合に基づいて生成 AI の概要をレイヤー化します。このスキルは、2 つのプレビュー要約 API をレコードの詳細ページとリストページに接続します。

検索の概要 API: 引用と共に、検索結果の AI 要約を返します。
データ要約 API: Dataverse テーブルのレコードごとの概要またはリストレベルの分析情報を返します。

この手順は、手順 4 のデータモデルと手順 6 の Web API 統合に基づいています。プラグインは、次のアクションを実行します。

概要統合ポイントのコードをスキャンし、ターゲットページ、テーブル、および使用する API を確認します。
不足している Web API の前提条件 (テーブルのアクセス許可、列リスト、Web ロール) を /integrate-webapi と /create-webrolesに委任するため、アクセス許可の信頼できるソースが 1 つ存在します。
偽造防止トークン処理、フレームワーク固有のラッパー (React hooks、Vue composables、または Angular サービス)、およびターゲットページ上の有線呼び出しサイトを含む型指定された概要サービス () を生成する aiSummaryService.tsエージェントを生成します。
プロンプトとコンテンツ制限のサイト設定を作成する Summarization エージェントを生成します。

提案を確認して承認します。 確認するまで、プラグインによってコードが生成されたり、設定が作成されたりすることはありません。

Note

概要 API はプレビュー段階であり、管理レベルとサイトレベルのコントロールがオンになっていることに依存します。展開後に概要が表示されない場合は、関連するサイト設定と管理者コントロールを使用して機能が有効になっていることを確認します。詳細については、Data 概要 API の概要および Power Pages 生成 AI を使用した検索を参照してください。

手順 7: Web ロールを作成する

/create-webrolesを実行して、ユーザーアクセスロールを定義します。プラグイン:

重複を回避するために、既存の Web ロールについて環境にクエリを実行します。
一意の識別子を持つロール定義を生成します。
各サイトに、最大で 1 つの匿名ロールと 1 つの認証済みロールがあることを強制します。

手順 8: 認証を設定する

/setup-authを実行して、サインイン、サインアウト、ロールベースのアクセス制御をサイトに追加します。プラグインは次の ID プロバイダーをサポートしており、1 つまたは複数のプロバイダーを同時に構成できます。

Provider	最適な用途
Microsoft Entra 外部 ID (顧客向けサイトに推奨)	セルフサービスサインアップを使用したパブリックサイトと顧客ポータル。
Microsoft Entra ID	社内の従業員ポータルまたは企業間 (B2B) パートナーサイト。 Power Pagesはサイトの親テナントを自動的に構成するため、テナント情報を入力する必要はありません。
Microsoft、Facebook、Google	コンシューマー対象ユーザー向けのソーシャルサインイン。
ローカル認証	ユーザー名とパスワードのサインイン。お勧めしません。明示的に要求した場合にのみ構成されます。

プロトコルや構成に関する考慮事項など、サポートされているプロバイダーの詳細については、「 Power Pagesを参照してください。

プラグイン:

サイト (目的、ページ、対象ユーザー) を分析し、適切な既定値を提案します。たとえば、プラグインは、顧客向けのサイトに対してオープン登録を行うMicrosoft Entra 外部 ID、または内部ポータルの招待専用登録を使用してMicrosoft Entra IDを提案します。推奨事項を受け入れるか、独自のプロバイダーを選択します。
各プロバイダーについて、テナントの作成、アプリの登録、ユーザーフローの作成、クライアント ID とリダイレクト URI のキャプチャなど、ID プロバイダーの管理センターのすべての前提条件の手順について説明します。プラグインは、会話に貼り付ける各値を検証し、サイトの正確なリダイレクト URI を計算して、アプリ登録に貼り付けた値がサイト設定に書き込まれた値と一致するようにします。
ユーザープロファイルデータを ID プロバイダーから Dataverse 連絡先レコード (要求マッピング) に流す方法、すべてのサインインと最初のサインインのみを同期するかどうか、および外部サインインを既存の連絡先に電子メールで自動リンクするかどうかを確認します。
認証サービス、型宣言、ロールベースの承認ユーティリティ (hasRole、 RequireAuth、 RequireRole)、SPA セッションの期限切れを防ぐセッションキープアライブフック、およびサイトレイアウトと統合されたサインイン/サインアウト UI コンポーネントを生成します。このプラグインは、React フック、Vue コンポーザブル、Angular サービス、Astro コンポーネントなど、フレームワーク全体のパターンを使用します。
複数のプロバイダーが構成されている場合は、選択したレイアウトでレンダリングされた /login ページ (水平行、垂直スタック、プライマリスポットライト、タブ付き) が生成されます。
各プロバイダー、登録モード、要求マッピング、およびオプション機能の .powerpages-site/site-settings/ の下に、一致するサイト設定を書き込みます。

また、プラグインを有効にすると、次のオプション機能も構成されます。

使用条件: /terms SPA ページのユーザーは、サインインを完了する前に同意する必要があります。また、一致するサイト設定とコンテンツスニペットも受け入れる必要があります。
ユーザープロファイルページ: サインインしているユーザーがPower Pages Web API を使用して連絡先情報を編集する /user-profile SPA ページ。
フェデレーションサインアウト: 共有デバイスまたは規制されたシナリオで、ユーザーがサイトからサインアウトするときに ID プロバイダーでユーザーをサインアウトします。

Tip

既存のサイトに 2 番目の ID プロバイダーを追加するには、もう一度 /setup-auth 実行します。プラグインは、既に構成されている内容を検出し、既存のプロバイダーを上書きせずに新しいプロバイダーを追加することを提供します。この方法は、Microsoft Entra 外部 IDから始めて、後でソーシャルサインイン用に Google を追加するなど、増分シナリオに役立ちます。

Note

クライアント側の承認 (RequireAuth、 RequireRole、 hasRole) は、ユーザーエクスペリエンスのみを対象としています。ユーザーに表示される内容を制御します。 /integrate-webapiによって構成されたサーバー側テーブルのアクセス許可によって、実際のセキュリティが適用されます。

手順 9: サーバーロジックを追加する

/add-server-logicを実行して、セキュリティで保護されたサーバー側エンドポイントをサイトに追加します。外部 API 呼び出し、サーバー側検証、シークレット管理、エンティティ間のデータ操作など、ブラウザーで実行できないロジックがサイトに必要な場合は、サーバーロジックを使用します。

Important

サーバーロジックのサポートには、PAC CLI バージョン 2.6.3 以降が必要です。クイックインストールスクリプトを使用して、最新バージョンに更新します。

プレーンな言語で必要なものを説明し、プラグインを次に示します。

ユースケースを分析し、その複雑さを分類する サーバーロジックアーキテクト エージェントを生成します。
エンドポイントの設計、セキュリティ構成、およびレビューに必要なテーブルのアクセス許可を提案します。
承認後、 /_api/serverlogics/<name>でサーバー側の JavaScript エンドポイントを生成します。
型指定されたクライアント側サービスを作成して、コンポーネントからエンドポイントを呼び出します。
新しいサービスを呼び出すためにコンポーネントを更新します。
エンドポイントの Web ロールの割り当てとテーブルのアクセス許可を構成します。

提案を確認して承認します。 確認するまでコードは生成されません。

一般的なユースケース:

外部サービスに接続します。 資格情報を公開せずに、REST API、Azure Functions、またはサードパーティのサービスを呼び出します。 (チュートリアル: 外部サービスとの対話)
セキュリティで保護されたデータ操作を実行します。 一貫性のあるサーバー側検証を使用して、Dataverse レコードのクエリ、更新、または削除を行います。 (チュートリアル: Dataverse テーブルを操作する)
カスタムロジックを実行します。 結果をクライアントに返す前に、テーブル間でデータを集計したり、ビジネスルールを適用したり、派生値を計算したりします。
シークレットをサーバー側で管理します。 資格情報と API キーをサーバーに格納します。クライアントコードには保存しません。 (Tutorial: Microsoft Graph と SharePoint との対話)

Note

ユースケースごとに 1 回、 /add-server-logic を実行します。たとえば、サイトでインベントリ検証エンドポイントとグローバル検索エンドポイントの両方が必要な場合は、スキルを 2 回実行します。

手順 10: クラウドフローを統合する

/add-cloud-flow を実行して、既存のPower Automate クラウドフローをサイトに統合します。このスキルは、Power Pages サイトを、Power Automateで既に作成したフローに接続します。新しいクラウドフローは作成されません。

プラグイン:

既存のクラウドフローをサイトに登録します。
ページからフローをトリガーするクライアント側コードを生成します。
非同期ワークフローの状態とコールバックパターンを処理します。
ページとフローの間のデータ交換を結び付けます。

/add-cloud-flowは、承認ワークフロー、電子メール通知、スケジュールされたジョブ、およびサーバー側のエンドポイントよりもPower Automateによって処理されるイベントドリブンの自動化に使用します。

代替方法: /integrate-backend を使用して完全なサービスレイヤーを計画する

Web API、サーバーロジック、またはクラウドフローが必要な機能がわからない場合は、手順 4 から 10 を手動で実行するのではなく、 /integrate-backend を実行します。このスキルは、次のようなオーケストレーターとして機能します。

プロトタイプを分析して、サービスレイヤーを必要とするすべての特徴を特定します。
各機能を適切なアプローチに分類します。標準 CRUD 用の Web API、サーバー側検証と外部 API 用のサーバーロジック、承認ワークフローと自動化のためのクラウドフロー。
すべてのスキル、依存関係、および構成を含むシーケンス実行プランを提案します。
承認したら、正しい順序でスキルを編成します。

プランは永続的で再開可能で、編集可能です。生成されたコードを確認したり、サイトをテストしたりするには、手順の後で停止し、 /integrate-backend をもう一度実行して中断した場所を選択します。

手順 11: SEO を追加する

/add-seoを実行して、サイトを検索エンジン用に最適化します。プラグイン:

フレームワークのルーター構成からルートを検出します。
検出されたすべてのルートの検索エンジンディレクティブとサイトマップを生成します。
メタタグ (ビューポート、文字セット、説明、Open Graph、Twitter Card、favicon 参照) を追加します。

手順 12: 最終的なサイトを展開する

任意の手順を実行する場合は、 /deploy-site をもう一度実行して、変更をライブにプッシュします。このプラグインは、実稼働ビルドを実行し、すべての展開成果物 (テーブルのアクセス許可、サイト設定、Web ロール、サーバーロジックファイル) と共にサイトをPower Pages環境にアップロードします。

手順 13: セキュリティレビューを実行する

運用環境に移行する前に、 /security-review を実行して、サイトのエンドツーエンドのセキュリティレビューを実行します。このスキルは、焦点を絞ったセキュリティスキルを調整し、すべての結果を docs/security-review-<timestamp>.html の単一の HTML レポートに統合します。

プラグインは、あなたの目標について1つの平文の質問をし、焦点を当てたスキルの一致するセットを選びます:

ゴール	チェック対象
コードと構成	ソースコード、依存関係、テーブルのアクセス許可、および認証の構成。ローカルファイルでのみ機能します。デプロイは必要ありません。
リリースの準備 ( 推奨)	発行する前に完全なレビューを行います。すべてのフォーカスされたスキル (コードと依存関係、deployed-site scan、ブラウザーセキュリティヘッダー、Web アプリケーションファイアウォール、テーブルのアクセス許可、認証) を実行します。
展開済みサイト	ライブのデプロイ済みサイトのスキャンのみ。発行済みサイトの継続的な監視に役立ちます。

確認した後、プラグインは一致するフォーカスされたスキルを並列で実行し、その結果を 1 つのレポートに書き込みます。

/scan-code:ローカルソースファイルに対して静的分析 (opengrep) と依存関係スキャン (trivy) を実行します。コードパターン、脆弱なパッケージ、ハードコーディングされたシークレット、ライセンスの問題を表示します。どちらのツールもインストールされていない場合、スキルはフォールバックとして手動コードレビューを提供します。
/scan-site: ライブサイトに対してサーバー側のセキュリティスキャンを開始し、最新のレポートをフェッチします。スキャン期間はサイトサイズによって異なります。小規模なサイトは数分で終了し、大規模なサイトには数時間かかることがあります。結果は重大度別にグループ化されます。デプロイ済みのサイトが必要です。
/manage-headers: .powerpages-site/site-settings/: コンテンツセキュリティポリシー、X フレームオプション、CORS、Cookie SameSite、および関連設定で構成された HTTP セキュリティヘッダーを検査します。不足値または弱い値を識別し、推奨される既定値を提案します。
/manage-firewall: マネージドルールの状態やカスタムルール (IP ブロック、国ブロック、パスブロック、レート制限) など、運用サイトの Web アプリケーションファイアウォール (WAF) を検査します。サポートされているリージョンの運用サイトでのみ使用できます。スキルが適格性の問題を検出して報告します。
/audit-permissions: サイトコードと Dataverse メタデータに対する既存のテーブルのアクセス許可を監査します。不足しているアクセス許可、過度に制限されたロール、未使用のアクセス許可、および YAML スキーマの問題を示します。

統合レポートでは、セクションごとに結果がグループ化され、既定のブラウザーで開き、プレーン言語の修復ガイダンスが含まれます。その後、チャットからプラグインは修正の手順を示します。検索を選択すると、プラグインは一致するフォーカスされたスキルを対話形式で呼び出して変更を適用します。

Note

セキュリティレビューでは、変更が自動的に適用されることはありません。各対象スキルは、統合実行時に読み取り専用レビューモードで実行されます。修正プログラムを適用するために、プラグインはアクションを選択した後、一致するスキルを対話形式で呼び出します。

Tip

また、任意のフォーカスされたスキルを単独で実行することもできます。

開発中に /scan-code を実行して、コードレベルの問題を早期にキャッチします。
/manage-headersを実行して、特定のコンテンツセキュリティポリシーエラーを修正するか、CORS を設定します。
/manage-firewallを実行して、サインインページにレート制限を追加するか、国ごとにトラフィックをブロックします。
テーブルのアクセス許可を変更した後 /audit-permissions を実行して、サイトコードと一致していることを確認します。
/security-reviewの目標を使用してを再実行し、時間の経過と共に運用サイトを監視します。

サイトを確認する

スキルを完了したら、Power Pages サイトが正しく動作することを確認します。

Power Pages に移動します。
[アクティブなサイト] リストでサイトを見つけます。
[プレビュー] オプションを使用して、デスクトップでサイトを プレビュー します。
機能をテストします。

複数の環境間でサイトを宣伝する

開発環境でサイトが動作したら、アプリケーションライフサイクル管理 (ALM) スキルを使用して、テスト環境と運用環境に昇格させます。このプラグインは、サイトを Power Platform ソリューションとしてパッケージ化し、環境によって異なる値を識別し、 Power Platform Pipelines または手動でのエクスポートとインポートを通じてソリューションをデプロイします。

ALM スキルを使用するには、少なくとも 1 つのターゲット Power Platform 環境 (テスト、運用、またはその両方) も必要です。オプションのAzure Key Vault フローをシークレットに使用するには、Azure サブスクリプションにキーコンテナーを作成するアクセス許可も必要です。

展開を計画する

/plan-almを実行して開始します。 /plan-alm は ALM のエントリポイントであり、他の ALM スキルを調整するため、通常は直接実行しません。プラグイン:

プロジェクト、ソリューション、およびターゲット環境の現在の状態を検出します。
プロモーション戦略 (Power Platform Pipelines または手動でのエクスポートとインポート)、ターゲットステージ、適用する制約について質問します。
docs/alm-plan.htmlで、実行するすべてのアクションを示すビジュアルプランを生成します。
ダウンストリームスキルを実行する前に、承認を待ちます。

プランはディスクに保持されるため、各ダウンストリームスキルは同じ永続化されたプランから読み取り、書き込みを行います。フェーズが失敗した場合は、 /plan-alm をもう一度実行すると、停止した場所から再開されます。

ソリューションを作成する

/setup-solutionを実行して、サイトを Power Platform ソリューションとしてパッケージ化します。プラグイン:

パブリッシャーとソリューションを作成し、Power Pages コンポーネント (サイト、Web ロール、サーバーロジックエンドポイント、クラウドフロー登録、OAuth プロバイダー設定) を追加します。
各サイト設定を秘密度で分類し、環境によって異なる値の環境変数を提案します。
Azure Key Vaultをプロビジョニングし、接続文字列や API キーなどの資格情報の種類の値を格納するオファー。
サイトにソリューションが既に存在する場合は同期モードで実行され、新しいソリューションを作成せずにコンポーネントを調整します。

提案を確認して承認します。 確認するまで、プラグインは構成を作成しません。

Tip

ソリューションが大きすぎるか、または確実にデプロイするには絡み合っている場合、プラグインは分割を推奨し、分割する場所を提案します。変更が適用される前に分割を確認します。

Power Platform Pipelines でデプロイ

プロモーション戦略として Power Platform Pipelines を選択した場合、プラグインは次のスキルを実行します。

/ensure-pipelines-host は、Power Platform Pipelines のホスト環境をプロビジョニングまたは検出します。このスキルは、無料のプラットフォームホスト、既存の環境の Pipelines アプリ、またはカスタムホストなど、テナントで使用できる最も低コストのオプションを選択します。
/setup-pipeline は、Dataverse にパイプライン定義を登録し、選択したステージを構成し、各ステージをターゲット環境にバインドします。
/deploy-pipeline は、ステージのデプロイをトリガーし、 deploymentSettings.jsonを介してステージごとの環境変数のオーバーライドを適用し、デプロイ台帳の状態を追跡します。

ターゲット環境が既に別の Power Platform Pipelines ホストにリンクされているためにデプロイが失敗した場合、プラグインは /force-link-environment 実行して再割り当てを行うことができます。アクションには明示的な同意が必要であり、元に戻すことができます。

手動エクスポートとインポートを使用したデプロイ

手動パスを選択すると、プラグインは次のコマンドを実行します。

/export-solution ソリューションをマネージド ZIP またはアンマネージド ZIP としてエクスポートする場合は、エクスポート前に完全性チェックを行います。
/import-solution ターゲット環境に ZIP をインポートする場合は、依存関係を最初に検証するか直接検証するようにステージングします。

展開されたサイトをアクティブ化して検証する

ターゲット環境に正常にデプロイされた後、プラグインは次の操作を行います。

/activate-siteを実行して、ターゲット環境にパブリック URL をプロビジョニングします。
/test-site実行してデプロイを確認します。プラグインは、ブラウザーを使用して、代表的なページのクロール、ロールベースのアクセスチェックの実行、 /_api/ 呼び出しの検証、 /_api/serverlogics/ エンドポイントからの応答図形のキャプチャを行います。スキルは、結果を PASS、 WARNINGS、または FAILとして報告し、チェックごとの詳細がプランからリンクされます。

ステップが失敗した場合、プラグインは /diagnose-deployment実行されます。スキルは、古いマニフェスト、不足している依存関係、ホストの競合、ブロックされた JavaScript、認証の期限切れなど、既知のデプロイエラーのカタログに対するエラーと一致し、具体的な修正を提案します。プラグインは、お客様の同意なしに修正プログラムを適用することはありません。

Note

すべての ALM スキルは、ディスク上の成果物 (ソリューションマニフェスト、計画データ、パイプライン台帳、デプロイ台帳、テスト結果) から読み取り、書き込みを行います。オーケストレーションは再開可能で監査可能です。任意の手順で何が起こったかを確認するには、成果物を調べます。

ヒントとベストプラクティス

次のヒントは、Power Pages サイトを構築するときにプラグインと AI コーディングエージェントを最大限に活用するのに役立ちます。

最初の実行時に不足しているツールのターミナル出力を監視する

プラグインはスキルとワークフローを提供しますが、AI コーディングエージェント (GITHUB COPILOT CLI または Claude Code) は、実際のコマンドをコンピューター上で実行します。これらのツールを初めて使用する場合は、ターミナル出力をよく見てください。 AI コーディングエージェントはバックグラウンドでコマンドとスクリプトを実行します。これらのコマンドの一部は、コンピューターにインストールされていない可能性があるツールに依存します。ステップが失敗した場合、ターミナル出力には通常、見つからなかったツールまたはコマンドが表示されます。

command not foundやis not recognizedなどのエラーが表示された場合は、不足しているツールをインストールし、ワークフローを再トリガーします。 AI コーディングエージェントは、ツールが使用可能になると中断したところから再開します。

承認する前にエージェントの提案を確認する

AI コーディングエージェントは、変更を加える前に、データモデルアーキテクトやアクセス許可アーキテクトからの提案などの提案を提示します。 AI コーディングエージェントによって生成されたコードと構成は不正確になる可能性があるため、承認またはデプロイする前に、すべての提案と生成されたすべてのコードを確認、テスト、検証します。

データモデルの提案: テーブル名、列の種類、リレーションシップがビジネス要件と一致することを確認します。データが既に挿入された後に列の名前を変更するよりも、提案を調整する方が簡単です。
権限提案: 各ロールがテーブルごとに適切なアクセスレベル（作成、読み取り、更新、削除）を持っていることを確認してください。テーブルのアクセス許可が過度に制限されているのは、一般的なセキュリティリスクです。
生成されたコード: デプロイする前に、生成されたコードを読み取り、サイトをローカルでテストします。 AI によって生成されたコードには、エラーやセキュリティの問題が含まれている可能性があります。

コンテキストを使用してエラーを直接貼り付ける

ビルドエラー、デプロイエラー、ブラウザーのランタイム例外のいずれであっても、何かが失敗した場合は、完全なエラー出力をコピーします。それを、実行していた内容の簡単な説明と共に貼り付けます。提供するコンテキストが多いほど、修正が速くなります。

例: ビルドエラー

I ran npm run build and got this error. Fix it.

error TS2339: Property 'jobTitle' does not exist on type 'JobPosting'.

  src/components/JobCard.tsx:24:31
    24   <Text>{posting.jobTitle}</Text>

Tip

ファイル名、実行したコマンド、発生する予定の内容を含めます。プラグインは、このコンテキストを使用して問題を特定し、推測するのではなく、対象の修正プログラムを適用します。

デプロイ後の一般的な問題は、列がAPIアクセスが有効になっていない場合のPower Pages Web APIからの403エラーです。このエラーが発生した場合は、 完全な API URL と 完全な JSON エラー応答を貼り付けます。エラーメッセージは、修正する必要があるテーブルと列を正確に示し、プラグインはテーブルのアクセス許可 YAML とサイト設定を更新できます。

例: Web API で列が有効になっていない (403)

I'm getting a 403 error when the documents page loads. Here's the API call and the response. Fix the issue so this API works.

URL:
https://my-site.powerappsportals.com/_api/crd50_documents?$select=crd50_documentid,crd50_name,crd50_documentcategory,crd50_filetype,crd50_filesize,crd50_updateddate,crd50_description,_crd50_propertyid_value

Response:
{
  "error": {
    "code": "90040101",
    "message": "Attribute _crd50_propertyid_value in table crd50_document is not enabled for Web Api.",
    "innererror": {
      "code": "90040101",
      "message": "Attribute _crd50_propertyid_value in table crd50_document is not enabled for Web Api.",
      "type": "AttributePermissionIsMissing"
    }
  }
}

このエラー (AttributePermissionIsMissing) は、参照列 _crd50_propertyid_value Dataverse テーブルに存在しますが、Web API のテーブルアクセス許可構成には一覧表示されていないことを意味します。プラグインは、不足している列をテーブルのアクセス許可 YAML に追加して、 .powerpages-site/table-permissions/ 再デプロイすることで、このエラーを解決します。

Note

Power Pages Web API では、API 呼び出しによって返されるすべての列がテーブルのアクセス許可に明示的に一覧表示されている必要があります。参照プロパティ ( _ プレフィックスが付き、サフィックスが _value) は、API 名が Dataverse の列の論理名と異なるため、見落としやすいです。 AttributePermissionIsMissingが表示されたら、常にその列をテーブルのアクセス許可に追加します。 API クエリは変更しないでください。

必要な内容について具体的に指定する

あいまいな要求はあいまいな結果を生み出します。レイアウト設定、データフィールド、動作など、必要なものをプラグインに正確に伝えます。

次の代わりに	試す
求人ページを作る	"上部に検索バーが表示された求人情報ページを作成し、場所と部門のチップをフィルター処理し、各ジョブのタイトル、会社、給与範囲、および投稿日を示すカードグリッドを作成します"
"スタイルを修正する"	ジョブカードはデスクトップ上で縦に積み重なります。画面が768pxより広い場合には、16pxのギャップを持つ3列グリッドで表示させるようにする。
"データの追加"	"現実的なタイトル、給与範囲が $60,000 ~$180,000、過去 30 日間に投稿された日付を含む 4 つの部門 (エンジニアリング、マーケティング、営業、人事) に 20 件のサンプル求人を追加する"
"API を設定する"	"JobListings コンポーネントを cr_jobposting Dataverse テーブルに接続します。ハードコードされた配列を、タイトル、部署、給与、および投稿日をフェッチする実際の API 呼び出しに置き換えます。
"ログインの追加"	"オープン登録でMicrosoft Entra 外部 IDサインインを設定し、2 番目のプロバイダーとして Google を設定します。サインインページで水平行として表示します。"

視覚的な問題にスクリーンショットを使用する

サイトがブラウザーで正しく表示されない場合は、スクリーンショットを撮って会話に直接貼り付けるか、ファイルパスを指定します。視覚的なコンテキストは、テキストで説明するのが難しいレイアウト、間隔、スタイルの問題を特定するのに役立ちます。

The header overlaps the hero section on mobile. Here's a screenshot:

[paste screenshot or provide path to screenshot file]

Fix the header so it doesn't overlap. It should be a fixed header with the content starting below it.

小さな手順で反復処理する

1 つのプロンプトでサイト全体を記述する代わりに、段階的にビルドします。構造とレイアウトから始めて、一度に 1 つずつ特徴を追加します。この方法では、各ステップでレビューとコースの修正を行う機会が与えられます。

Step 1: /create-site → Get the basic scaffold and layout right
Step 2: "Add a hero section to the home page with a search bar"
Step 3: "Add a job listings page with filter and sort"
Step 4: "Add a job detail page that shows full description"
Step 5: /setup-datamodel → Create tables now that you know the data shape
Step 6: /integrate-webapi → Wire up real data

Tip

各手順の後、ブラウザーのプレビューを確認します。何かが正しくない場合は、先に進む前に修正してください。 1 つのコンポーネントで問題を解決する方が、サイト全体で問題をアンタングルするよりも簡単です。

承認する前に説明を求める

提案された変更 (特にアクセス許可、データモデルの変更、または認証構成) が不明な場合は、承認する前にプラグインに内容とその理由を説明するように求めてください。

Before you create the table permissions, explain what access each role will have and why. I want to understand the security implications.

問題から回復するためにスキルを個別に実行する

スキルが途中で失敗した場合は、最初からやり直す必要はありません。各スキルは個別に実行され、中断したところから取得できます。たとえば、3 番目のテーブル /integrate-webapi 失敗した場合は、再実行して、既に完了した作業を検出できます。

/integrate-webapi failed while processing the cr_applications table. Here's the error: [paste error]. Resume the integration from where it stopped.

フィードバック

このページはお役に立ちましたか?

Last updated on 2026-06-12

GitHub Copilot CLI と Claude Code 向けの Power Pages プラグインを使い始める

前提条件

ソフトウェア要件

プラグインをインストールする

クイック インストール (推奨)

Marketplace からインストールする

スキルの概要

一般的なワークフロー

Power Pages サイトを構築する

手順 1: サイトを作成する

手順 2: サイトを展開する

手順 3: サイトをアクティブ化する

手順 4: データ モデルを設定する

手順 5: サンプル データを追加する (省略可能)

手順 6: Dataverse Web API と統合する

AI で生成された概要を追加する (省略可能)

手順 7: Web ロールを作成する

手順 8: 認証を設定する

手順 9: サーバー ロジックを追加する

手順 10: クラウド フローを統合する

代替方法: /integrate-backend を使用して完全なサービス レイヤーを計画する

手順 11: SEO を追加する

手順 12: 最終的なサイトを展開する

手順 13: セキュリティ レビューを実行する

サイトを確認する

複数の環境間でサイトを宣伝する

展開を計画する

ソリューションを作成する

Power Platform Pipelines でデプロイ

手動エクスポートとインポートを使用したデプロイ

展開されたサイトをアクティブ化して検証する

ヒントとベスト プラクティス

最初の実行時に不足しているツールのターミナル出力を監視する

承認する前にエージェントの提案を確認する

コンテキストを使用してエラーを直接貼り付ける

完全な要求 URL で Web API エラーを共有する

必要な内容について具体的に指定する

視覚的な問題にスクリーンショットを使用する

小さな手順で反復処理する

承認する前に説明を求める

問題から回復するためにスキルを個別に実行する

関連するコンテンツ

フィードバック

その他のリソース

クイックインストール (推奨)

手順 4: データモデルを設定する

手順 5: サンプルデータを追加する (省略可能)

手順 9: サーバーロジックを追加する

手順 10: クラウドフローを統合する

代替方法: /integrate-backend を使用して完全なサービスレイヤーを計画する

手順 13: セキュリティレビューを実行する

ヒントとベストプラクティス