experience-ui-bundle-app-coordinate

UI バンドルアプリの構築

概要

自然言語による説明をもとに、依存関係の正しい順序で専門的な UI バンドルスキルを連携させ、デプロイ可能な完全な Salesforce React UI バンドルアプリを構築します。各スキルは、各フェーズを実行する前に必ず明示的に読み込む必要があります。

重要：要件分析を終えて次に進む前に、プロンプトに矛盾する要件が含まれていないことを確認してください（例：「認証なし」＋「ユーザー固有のデータ」、「公開アクセス」＋ログインが必須の機能）。矛盾が見つかった場合は、作業を停止してユーザーに曖昧さの解消を求めてください。解釈を黙ってひとつに決めて先に進んではいけません。矛盾の確認項目全体については、STEP 1 のアクション #8 を参照してください。

前提条件

いずれかのフェーズを開始する前に、次の前提条件を満たしていることを確認してください。

1. 認証済みの Salesforce 組織：sf org display を実行し、デフォルトの組織が設定され、認証されていることを確認します。設定されていない場合は、ユーザーに認証を促します：sf org login web
2. 必要な CLI ツール：sf、npm、npx が使用可能であることを確認します（metadata.cliTools で宣言されています）。
3. Node.js のバージョン：node scripts/check-prerequisites.mjs を実行し、エラーがあれば報告します。
4. 組織の機能（デプロイする場合）：Experience Cloud が有効であること、適切なライセンスがあること、Sites が有効であること。

前提条件を満たしていない場合は、いずれのフェーズも実行せずに作業を停止し、満たされていない要件を具体的に報告してください。

このスキルを使用する場合

次の場合に使用します：

• ユーザーが Salesforce 上の「React アプリ」、「UI バンドル」、「ウェブアプリ」、「フルスタックアプリ」を求めている
• ユーザーが「アプリを構築」、「アプリケーションを作成」と述べており、文脈から LWC ベースではないフロントエンド（例：React）が意図されている
• 単独のコンポーネントではなく、スキャフォールディング、機能、データアクセス、UI を含む完全な UI バンドルを作成する

このスキルの使用対象となる例：

• 「Salesforce のデータを使って顧客ケースを管理する React アプリを構築してください」
• 「検索とナビゲーション機能を備えた従業員名簿の UI バンドルを作成してください」
• 「認証、データテーブル、ファイルアップロード機能を備えたフルスタック React アプリが必要です」
• 「Salesforce 上にコーヒーショップの注文アプリを構築してください」

次の場合は使用しないでください：

• 単一のページまたはコンポーネントを作成する場合（experience-ui-bundle-frontend-generate を使用）
• 機能のインストールのみを行う場合（experience-ui-bundle-features-generate を使用）
• データアクセスの設定のみを行う場合（experience-ui-bundle-salesforce-data-access を使用）
• 既存アプリのデプロイのみを行う場合（experience-ui-bundle-deploy を使用）
• カスタムオブジェクトとメタデータを使って Lightning Experience アプリを構築する場合（platform-lightning-app-coordinate を使用）
• 既存の UI バンドルのトラブルシューティングやデバッグを行う場合

プロンプト分類キーワード

このスキルは、プロンプトの生テキストから直接 2 つの判断を行います。以下の表を両方の唯一の情報源として使用してください。このファイル内のほかの場所でリストを言い換えたり、再導出したりしないでください。

1. プロンプトに以下のいずれかが含まれる場合、Phase 2（機能）が必要です。

カテゴリ	キーワード	注記
データ機能	search, filter, sort, pagination, table, grid, list
ナビゲーション	navigation, nav, menu, routing
認証	authentication, auth, login, logout, user session, user login
インテグレーション	upload, file
UI	shadcn, components, forms, buttons, cards
チャット（Phase 5 のみ）	chat	Phase 5 のみ。ただし、Phase 2 のキーワードと組み合わされている場合（例：「認証を備えたチャット」）は、認証の前提条件に対応するため、まず Phase 2 を実行します

あるカテゴリを否定しても（例：「認証なし」「ログイン不要」「パブリックアクセス」）、別のカテゴリのトリガーは無効になりません。各カテゴリは個別に評価されます。例：「ログイン不要、フィルタリングあり」の場合、「filtering」がデータ機能に該当するため、Phase 2 が実行されます。プロンプトが上記のキーワードのいずれにも該当しない場合に限り、Phase 2 をスキップしてください。

2. ホスティング対象 — プロンプトのキーワードから抽出します。

ホスティング対象	キーワード
Experience Site	"Experience Site", "Community", "external users", "public users", "guest users"
Custom Application	"Custom Application", "internal users", "Lightning app"

プロンプトがどちらのリストにも該当しない場合、または両方に該当する場合は、推測せず、先にユーザーに確認してください。

---

依存関係グラフとビルド順序

Phase 0：テンプレートの提案とブートストラップ（前提条件）

Offer prebuilt starter template (experience-ui-bundle-project-generate)
    v
If template chosen: scaffold via sf template generate project -- Phase 1 skipped
    v
If declined: run node scripts/check-sfdx-project.mjs
    v
If missing: create sfdx-project.json
    v
Verify project directory initialized

スクラッチから構築する前に、より速く、エラーが起こりにくい開始方法を提案します。テンプレートを使用しない場合は、UI バンドルの生成を試みる前に SFDX プロジェクトが存在することを確認します。これを行わないと、sf template generate ui-bundle は致命的なエラーで失敗します。必ず最初に確認し、プロジェクト構造が存在すると決めつけないでください。

アクション： experience-ui-bundle-project-generate を読み込み、2 つのスターターテンプレートを提示します。断られた場合は node scripts/check-sfdx-project.mjs を実行します。エラーが発生した場合は、不足している sfdx-project.json を作成してから続行してください。

フェーズ 1：足場づくり（基盤）

Determine hosting target (Experience Site / Custom Application)
    v
UI Bundle scaffold (sf template generate ui-bundle --template reactbasic)
    v
Install dependencies (npm install)
    v
Bundle metadata (uibundle-meta.xml with <target>, ui-bundle.json)
    v
CSP Trusted Sites (if external domains needed)

UI バンドルのディレクトリ構造、メタ XML（ホスティング先を含む）、およびオプションのルーティング／ヘッダー設定を作成します。重要：メタデータスキルではフェーズ 1 で <target> が必要となるため、ホスティング先を最初に決定する必要があります。以降のすべてのフェーズでは、この足場が存在している必要があります。

プロンプトで範囲が制限されている場合は、使用しない足場を削除してください。 reactbasic テンプレートには、プロンプトで求められている内容にかかわらず、shadcn コンポーネント一式、GraphQL ツール群（codegen.yml、.graphqlrc.yml、src/api/graphqlClient.ts、graphql:* npm スクリプト）、テスト基盤（playwright.config.ts、vitest.config.ts、vitest.setup.ts）が含まれています。プロンプトでスコープが明示的に制限されている場合（例：「機能や連携は省略する」、「X の足場づくりと構築だけ」、「依存関係のインストールは不要」など）、その結果としてフェーズ 2 および／またはフェーズ 3 をスキップする際は、フェーズ 4 の実行前に、それらのフェーズで扱うはずだった足場の要素を削除してください。

• フェーズ 2 をスキップした場合 → フェーズ 4 のページが実際にインポートしているものを除き、src/components/ui/ 内の shadcn コンポーネントを削除します。未使用のサンプル／デモコンポーネントも削除します。
• フェーズ 3 をスキップした場合 → codegen.yml、.graphqlrc.yml、src/api/graphqlClient.ts、package.json の graphql:schema／graphql:codegen スクリプト、およびテンプレートにあらかじめ含まれている hooks/ 内のデータ取得用スタブ（例：useAsyncData.ts）を削除します。
• テストもデプロイも求められていない場合 → プロンプトがテストを示唆している場合に限り、playwright.config.ts／vitest.* を残します。それ以外の場合はこれらも削除します。
• 実際に構築したアプリについて説明するよう README.md を書き換えます。汎用テンプレートの定型文を残さないでください。プロンプトが最小限の作業のみを指示している場合は、削除してください。

ファイルの削除は作業の半分にすぎません。同じ作業の中で、そのファイルへの参照もすべて削除してください。そうしなければ、過剰生成を避ける代わりに、ファイル間の整合性が崩れます（さらに悪いことに、参照先のないインポートは単なる範囲逸脱ではなく、機能上の問題です）。 具体的には、上記のいずれかを削除した後、次の作業を行ってください。

• vite.config.ts — codegen.yml を削除した場合は、vite-plugin-graphql-codegen のインポートと codegen({ configFilePathOverride: ... }) プラグインブロックを削除します。vitest.* を削除した場合は、test: 設定ブロック（setupFiles、coverage など）を削除します。
• package.json — 設定ファイルだけでなく、使用されなくなった依存関係（vite-plugin-graphql-codegen、@graphql-codegen/*、playwright、vitest など）と npm スクリプトも削除します。
• 削除したフック、クライアント、または shadcn コンポーネント（例：useAsyncData、graphqlClient）をインポートするコンポーネント／ページは、そのインポートと使用箇所を削除するか、置き換える必要があります。存在しなくなったファイルを参照するインポートを決して残さないでください。
• 同じ作業の中で、別の箇所で削除したファイルを再追加しないでください（例：.graphqlrc.yml を出力しつつ codegen.yml を削除する）。関連する各項目のスコープを一度決め、その項目に関係するすべてのファイルに一貫して適用してください。
• フェーズ 4 を完了する前に、削除したファイルごとに node scripts/check-dangling-refs.mjs <deleted-basename> を実行し、エラーがあれば報告してください。

フェーズ 2：機能（プロンプトに機能キーワードが含まれる場合は必須 — 上記の「プロンプト分類キーワード」を参照）

Search project code (src/) for existing implementations
    v
Install dependencies (npm install)
    v
Search, describe, and adopt features (auth, shadcn, search, navigation, GraphQL)
    v
Resolve conflicts (two-pass: --on-conflict error, then --conflict-resolution)
    v
Integrate __examples__ files into target files (verify build succeeds), then delete them

機能スキルを読み込み、事前構築済みパッケージをインストールするか、テンプレートにすでに含まれているものを採用します。カタログ機能を独自に実装してはいけません。トリガーと否定表現の扱いについては、「プロンプト分類キーワード」を参照してください。

インタラクティブ機能のない最小限の「hello world」の場合に限り、スキップしてください。あらかじめ含まれている機能がある場合でも、このフェーズは必須です。

フェーズ 2.5：カスタムオブジェクト（組織に存在しない新しいカスタム Salesforce オブジェクトがプロンプトで必要な場合は必須）

フェーズ 2.5（カスタムオブジェクト）の詳細については、references/phase-custom-objects.md を参照してください。

フェーズ 3：データアクセス（バックエンドの接続）

Ground every entity/field against the org (per experience-ui-bundle-salesforce-data-access)
    v
Generate queries/mutations FROM the verified names (never from guessed fields)
    v
Generate types (npm run graphql:codegen) and wire into components
    v
Validate and test (npx eslint, ask user before testing mutations)

@salesforce/platform-sdk Data SDK（createDataSDK().graphql）を使用して、データレイヤーを設定します。 レコード操作には GraphQL が推奨されます。Connect、Apex、UI API のエンドポイントには REST を使用します。グラウンディングと作成のワークフローは experience-ui-bundle-salesforce-data-access スキルが担います。このスキルを読み込んでその手順に従い、ローカルスキーマの検索やフィールド名の推測で代用しないでください。 グラウンディングは 稼働中の組織を対象に行うため、ローカルの schema.graphql がなくても実行できます。フェーズ 2.5 で 新しいオブジェクトを作成した場合、このフェーズのグラウンディング手順で検出できるよう、事前にデプロイする必要があります。

フェーズ 4：UI（フロントエンド）

Layout, navigation, header, and footer (appLayout.tsx)
    v
Pages (routed views)
    v
Components (widgets, forms, tables)

React UI を構築します。フェーズ 3 のデータレイヤーとフェーズ 2 の機能を参照します。ボイラープレートとプレースホルダーのコンテンツはすべて置き換える必要があります。

フェーズ 5：統合（任意）

Agentforce chat widget (if requested)
File upload API (if requested)

これらはそれぞれ独立しているため、両方が必要な場合は並行して実行できます。

フェーズ 6：デプロイ

Org authentication
    v
Pre-deploy UI bundle build (npm install + npm run build)
    v
Deploy metadata
    v
Post-deploy configuration (permissions, profiles, named credentials, connected apps, custom settings, flow activation)
    v
Import data (if data plan exists)
    v
Fetch GraphQL schema and run codegen
*(Re-fetches schema from the deployed org -- required because the remote schema may differ from the local one used in Phase 3. Guard against an empty or stale result -- Salesforce Edge caching can briefly serve the pre-deploy schema; re-fetch/retry before trusting it as empty and before running codegen)*
    v
Final UI bundle build (rebuilds with the deployed schema)

標準の 7 ステップのデプロイ手順に従います。スキーマを取得する前にメタデータをデプロイする必要があります。スキーマを取得する前に権限を割り当てる必要があります。

フェーズ 7：ホスティング対象のインフラストラクチャ

フェーズ 1 で決定したホスティング対象のインフラストラクチャをデプロイします。アプリの対象ユーザーに基づいて、次のいずれか 1 つを選択してください。

フェーズ 7a：Experience Site（外部向け）

Resolve site properties (siteName, appDevName, etc.)
    v
Generate site metadata (Network, CustomSite, DigitalExperience)
    v
Deploy site infrastructure

UI バンドルをホストする Digital Experience サイトを作成します。外部ユーザー向けの公開 URL または認証が必要なサイト URL をユーザーが求めている場合に使用します。注：<target>ExperienceSite</target> はフェーズ 1 ですでにメタ XML に設定されています。

フェーズ 7b：カスタムアプリケーション（社内向け）

Resolve app properties (appName, appNamespace, appLabel)
    v
Generate CustomApplication metadata (applications/*.app-meta.xml)
    v
Deploy custom application

Lightning App Launcher にカスタムアプリケーションのエントリを作成します。Lightning Experience 内でアクセスする社内ユーザー向けのアプリに使用します。注：<target>CustomApplication</target> はフェーズ 1 ですでにメタ XML に設定されています。

---

実行ワークフロー

ステップ 0：事前構築済みテンプレートを提示する（ゼロからスキャフォールディングする前に）

要件を分析したりスキャフォールディングしたりする前に、事前構築済みのスターターテンプレートが適しているか確認します。ゼロから構築するよりも迅速で、エラーも少なくなります。

• スキルを読み込む：experience-ui-bundle-project-generate を呼び出します。 最小構成の React スタータープロジェクトを 2 種類（社内向け／従業員向けと、外部向け／顧客向け）提示します。ユーザーがどちらかを選択した場合は、sf template generate project を使用してプロジェクトディレクトリに生成します。
• ユーザーがテンプレートを選択した場合： スキャフォールディングのフェーズ（フェーズ 1）は実質的に完了です。そのままプロジェクトの内容追加やカスタマイズに進み、変更内容に合ったフェーズ（通常はフェーズ 4 の UI またはフェーズ 3 のデータアクセス）から続けて、フェーズ 6 でデプロイします。
• ユーザーがテンプレートを選択しない場合（ゼロから始めたい、または適したテンプレートがない場合）：通常どおりステップ 1 に進みます。

このステップを黙って省略しないでください。ゼロからアプリを構築する場合は、必ず最初に選択肢を提示してください。

STEP 1：要件の分析と計画

アクション：

1. ユーザーの自然言語によるリクエストを解析します
2. アプリ名と目的を特定します
3. ページとナビゲーション構造を抽出します
4. 必要なデータエンティティと Salesforce オブジェクトを特定します
5. 機能要件（認証、検索、ファイルアップロード、チャット）を検出します
6. ホスティング先（Experience Site または Custom Application）を決定します — 上記の「プロンプト分類キーワード」を参照してください。不明確な場合は、先に進む前にユーザーに確認してください
7. CSP 登録が必要な外部ドメインを特定します
8. 要件の矛盾を確認します — 次のいずれかの矛盾が検出された場合は、作業を中断してユーザーに確認してください：
   • 「認証なし」または「公開／ゲストアクセス」と、「ユーザー固有のデータ」、「現在のユーザーのデータを表示」、「My [Entity]」ビューのいずれかの組み合わせ
   • 「外部ユーザー」と「Custom Application」の組み合わせ（Custom Apps は社内専用です）
   • 「公開アクセス」と、ログインが必要な機能（ファイルアップロード、ユーザープロファイル、パーソナライズ）の組み合わせ

計画には、クエリの作成より前に明示的なグラウンディング手順を必ず含めてください。 推測したオブジェクト名や項目名を確定事項として記載し、検証をコード生成に先送りしてはいけません。計画のデータアクセス部分には、次のように記載してください：「これらのエンティティ／項目を組織に照らして検証し（experience-ui-bundle-salesforce-data-access を使用）、検証済みの名前からクエリを作成する。」先にクエリを作成し、後でコード生成する計画は、推測した項目や手作業で仮置きした型を生み出す失敗パターンです。そのような計画は出力しないでください。

出力（ビルド計画）の前に、以下を検証してください：

• 要件の矛盾がないこと — 矛盾がある場合（上記アクション #8 を参照）は作業を中断し、次のように報告します：

  ERROR: Conflicting requirements detected:
  - [describe the specific conflict, e.g., "The prompt requires 'no authentication' while also requiring a 'My Cases' view scoped to the current user's identity"]
  
  RESOLUTION NEEDED: Please clarify:
  - [specific question, e.g., "Should the app require login (removing the 'no authentication' requirement), or should all data be public (removing the user-scoped view)?"]
  

  この矛盾が解決するまで、ビルド計画の生成やいずれのフェーズの実行にも進まないでください。

出力：ビルド計画

UI Bundle App Build Plan: [App Name]

SCAFFOLDING:
- App name: [PascalCase name]
- Hosting target: [Experience Site / Custom Application] **REQUIRED**
- Routing: [SPA rewrites, trailing slash config]
- External domains: [domains needing CSP registration]

FEATURES:
- [list of features to install: auth, shadcn, search, navigation, etc.]

CUSTOM OBJECTS (if applicable):
- New objects/fields: [list any object the org does not already have, with its fields -- delegate to platform-custom-object-generate, not authored here]

DATA ACCESS:
- Objects: [Salesforce objects to query/mutate]
- Grounding: [verify each object + its fields against the org via experience-ui-bundle-salesforce-data-access BEFORE authoring — list the objects/fields to confirm, not assumed-correct names]
- Queries: [GraphQL queries to author FROM the verified names]
- REST endpoints: [only where GraphQL/uiapi genuinely cannot cover it — not as a fallback for fields that were hard to verify]

UI:
- Layout: [description of app shell/navigation]
- Pages: [list of pages with routes]
- Components: [key components per page]
- Design direction: [aesthetic/style intent]

INTEGRATIONS (if applicable):
- Agentforce chat: [yes/no, agent ID if known]
- File upload: [yes/no, record linking pattern]

DEPLOYMENT:
- Target org: [org alias if known]

SKILL LOAD ORDER:
0. experience-ui-bundle-project-generate (offer a prebuilt template first; if chosen, Phase 1 scaffolding is skipped; if declined, run the Bootstrap check for an existing SFDX project -- no skill load required)
1. experience-ui-bundle-metadata-generate (determines hosting target FIRST)
2. experience-ui-bundle-features-generate (if features needed)
2.5. platform-custom-object-generate (if the prompt requires a new custom Salesforce object the org doesn't have -- MUST complete and deploy before step 3)
3. experience-ui-bundle-salesforce-data-access (if data access needed)
4. experience-ui-bundle-frontend-generate
5a. experience-ui-bundle-agentforce-client-generate (if chat requested)
5b. experience-ui-bundle-file-upload-generate (if file upload requested)
6. experience-ui-bundle-deploy
7a. experience-ui-bundle-site-generate (if Experience Site requested -- external users)
7b. experience-ui-bundle-custom-app-generate (if Custom Application requested -- internal users)

STEP 2: フェーズごとの実行

references/phase-execution-pattern.md の標準パターンに従い、各フェーズを順番に実行します。**重要：実行前に必ずスキルを読み込んでください。**フェーズを省略したり順序を入れ替えたりすると、アプリが正しく動作しなくなります。

---

Phase 0 -- テンプレートの提示とブートストラップ

• experience-ui-bundle-project-generate を読み込み、テンプレートを提示します。選択された場合：Phase 1 をスキップし、Phase 2 に進みます。辞退された場合：node scripts/check-sfdx-project.mjs を実行し、プロジェクトがなければ作成します。

Phase 1 -- スキャフォールディング（Phase 0 でテンプレートを使用した場合はスキップ）

• 前提条件：node scripts/check-sfdx-project.mjs が成功すること
• experience-ui-bundle-metadata-generate を読み込みます。最初にホスティング先を決定します。sf template generate ui-bundle --template reactbasic を実行し、メタ XML を <target> で設定します。
• 実行後の検証：node scripts/check-phase-1-complete.mjs が成功すること

Phase 2 -- 機能（「プロンプト分類キーワード」を参照し、機能に関するキーワードがあれば、インストール済みの場合でも実行）

• experience-ui-bundle-features-generate を読み込みます。機能をインストールし、サンプルを統合します。npm run build で検証します。

Phase 2.5 -- カスタムオブジェクト（組織に必要なオブジェクトがすべてある場合はスキップ）

• references/phase-custom-objects.md を読み、実行手順に従います。

Phase 3 -- データアクセス（Salesforce データがない場合はスキップ）

• experience-ui-bundle-salesforce-data-access を読み込みます。スキーマを取得し、エンティティをグラウンディングして、クエリ／ミューテーションを生成します。npx eslint で検証します。

Phase 4 -- UI（必ず実行）

• 前提条件：node scripts/check-phase-1-complete.mjs が成功すること
• experience-ui-bundle-frontend-generate を読み込みます。レイアウト、ページ、コンポーネントを構築します。ボイラープレートをすべて置き換えます。
• 実行後の検証：node scripts/check-phase-4-complete.mjs が成功すること
• 重要：Phase 4 で実際の React UI を生成します。絶対にスキップしないでください。

Phase 5 -- 統合（依頼されていない場合はスキップ）

• 必要に応じて experience-ui-bundle-agentforce-client-generate（5a）および／または experience-ui-bundle-file-upload-generate（5b）を読み込みます。

Phase 6 -- デプロイ

• 前提条件：node scripts/check-phase-6-ready.mjs が成功すること
• experience-ui-bundle-deploy を読み込みます。7 ステップの手順に従います。利用可能な場合は scripts/org-setup.mjs を優先します。
• 重要：空のスキーマに注意してください。コード生成の前に、取得を 3 回再試行します。

Phase 7a -- Experience Site（外部ユーザー向け）

• トリガー：node scripts/check-hosting-target.mjs の出力が "ExperienceSite" の場合
• experience-ui-bundle-site-generate を読み込みます。サイトのインフラストラクチャをデプロイします。

Phase 7b -- カスタムアプリケーション（内部ユーザー向け）

• トリガー：node scripts/check-hosting-target.mjs の出力が "CustomApplication" の場合
• experience-ui-bundle-custom-app-generate を読み込みます。アプリのメタデータをデプロイします。

STEP 2.5: フェーズ完了の検証

STEP 3（最終サマリー）に進む前に、必須のフェーズがすべて実行されたことを検証します。重大な問題と警告のチェックリスト、および報告する正確なエラー／警告文については、references/phase-completion-validation.md を参照してください。

STEP 3: 最終サマリー

すべてのフェーズが完了したら、ビルドのサマリーを提示します。

UI Bundle App Build Complete: [App Name]

PHASES COMPLETED:
[x] Phase 0: Template Offer & Bootstrap -- [template used: <name> / declined; SFDX project verified/created]
[x] Phase 1: Scaffolding -- [app name] UI bundle created with hosting target [Experience Site / Custom Application]
[x] Phase 2: Features -- [list of features installed, or "skipped"]
[x] Phase 2.5: Custom Objects -- [list of objects/fields created and deployed, or "skipped -- no new schema needed"]
[x] Phase 3: Data Access -- [list of entities wired up]
[x] Phase 4: UI -- [count] pages, [count] components
[x] Phase 5: Integrations -- [list or "none"]
[x] Phase 6: Deployment -- deployed to [org]
[x] Phase 7: Hosting Target -- [Experience Site URL / Custom Application name] **(never "skipped" -- Phase 1 requires a target, so exactly one of 7a/7b always runs)**

FILES GENERATED:
[list key files and their paths]

NEXT STEPS:
[any manual steps the user should take]

---

検証

ビルドが完了したと提示する前に、次の項目を確認してください。

• スキャフォールドが存在する：有効なメタ XML と ui-bundle.json を含む UI バンドルディレクトリがある
• ホスティング先が確定し、デプロイされている：メタ XML に <target>ExperienceSite</target> または <target>CustomApplication</target> が含まれている（未設定のままにしない）。また、対応する Phase 7a または 7b のインフラストラクチャが生成され、デプロイされている。スキップされていないこと
• 依存関係がインストールされている：node_modules/ が存在し、package.json に想定されたパッケージが含まれている
• ビルドが成功する：npm run build がエラーなしで dist/ を生成する
• dist のコンテンツが存在する：dist/ に index.html、JS/CSS バンドル、アセットが含まれている（空のディレクトリだけではない）
• Lint が成功する：npx eslint src/ のエラー数が 0 である
• ボイラープレートが残っていない：すべてのプレースホルダーテキスト、デフォルトのタイトル、テンプレートコンテンツが置き換えられている
• ナビゲーションが機能する：appLayout.tsx に、作成したページに対応する実際のナビゲーション項目がある
• データレイヤーが接続されている：コンポーネントが @salesforce/platform-sdk Data SDK（createDataSDK().graphql）を使用し、すべてのエンティティとフィールドが推測ではなく組織に基づいている（データアクセスフェーズを実行した場合）
• CSP が登録されている：すべての外部ドメインに CSP Trusted Site メタデータがある（該当する場合）

---

エラー処理

カテゴリー 1：停止してユーザーに確認する

• アプリの目的が曖昧すぎて、ページやデータのニーズを判断できない
• ユーザーが矛盾する機能を求めている（例：「認証なし」＋「ユーザー固有のデータを表示」）
• ホスティング先を特定できない（「内部ユーザー向け（Custom Application）ですか、外部ユーザー向け（Experience Site）ですか？」と確認する）
• 対象組織が不明で、デプロイが要求されている

カテゴリー 2：警告を記録して続行する

• 機能のインストールで軽微な競合が発生する（解決して続行する）
• オプションの統合設定で、処理を妨げない問題が発生する
• ビルドでエラーではない警告が発生する

---

ベストプラクティス

1. フェーズの順序を必ず守る

機能をインストールする前に UI を構築しないでください。ビルドする前にデプロイしないでください。依存関係の順序は厳守してください。

2. ボイラープレートをすべて置き換える

生成するアプリはすべて、目的に合わせて作られたものにしてください。「React App」というタイトル、「Vite + React」というプレースホルダー、すべてのデフォルトコンテンツを、実際のアプリに適したテキストやブランディングに置き換えてください。

3. 意図を持ってデザインする

experience-ui-bundle-frontend-generate のデザイン思考とフロントエンドの美学に関するガイダンスに従ってください。すべてのアプリに明確なビジュアルの方向性を持たせ、汎用的なデフォルト設定にしないでください。