mcp-app-builder

MCP アプリの作成

MCP アプリは、ツールとカスタム UI ビューを通じて AI アシスタントを拡張する、会話型のエクスペリエンスです。会話中に呼び出される MCP サーバーとして構築されます。

⚠️ アプリは、人間とAI アシスタントの LLMという 2 人のユーザーが同時に利用します。ビューを介して連携し、人間はビューを操作し、LLM はその状態を確認します。コードを書く前に、この点をしっかり理解してください。ビューは、両者が共有する画面です。

SPEC.md には、アプリの要件と設計上の決定を記録します。作業中は常に最新の状態に保ってください。

SPEC.md がありませんか？ → まず discover.md を読んでください。SPEC.md が作成されるまでは、ほかの作業には進まないでください。

SPEC.md がありますか？ → SPEC.md を読み、architecture.md に従って変更を設計します。SPEC.md を更新してから、コードを書く前に、以下の関連する実装リファレンスを読んでください。

Skybridge < 0.36.x から移行しますか？ → まず migrate-to-v1.md を読んでください。ユーザーが skybridge >= 0.36.x を v1 として参照する場合があります。

Skybridge 1.x から 2.x に移行しますか？ → まず v2.0.0 のリリースノートを取得して、その手順に従ってください。

E コマースアプリを構築しますか？ → まず ecommerce.md を読んでください。

セットアップ

1. テンプレートをコピーする → copy-template.md：SPEC.md が用意された状態で新しいプロジェクトを始めるとき
2. ローカルで実行する → run-locally.md：テストの準備ができたとき、開発サーバーまたは ChatGPT/Claude との接続が必要なとき
3. 評価 → evals.md：テストで、実際のモデルが自然なプロンプトから適切なツールにたどり着けるかを確認するとき

アーキテクチャ

UX フローや API の構成を設計、または改善する → architecture.md

実装

• データの取得と表示 → fetch-and-render-data.md：サーバーハンドラーやビューのデータ取得を実装するとき
• 状態とコンテキスト → state-and-context.md：ビューの UI 状態を保持し、LLM コンテキストを更新するとき
• LLM にプロンプトを送る → prompt-llm.md：ビューから LLM の応答をトリガーする必要があるとき
• UI ガイドライン → ui-guidelines.md：表示モード、レイアウトの制約、テーマ、デバイス、ロケールについて
• 外部リンク → open-external-links.md：外部 URL にリダイレクトするとき、または「アプリで開く」ためのターゲットを設定するとき
• ファイルのダウンロード → download-file.md：ユーザーのファイルシステムにコンテンツを保存するとき
• OAuth → oauth.md：ユーザー固有のデータにアクセスするため、ツールでユーザー認証が必要なとき
• CSP → csp.md：フェッチ、アセット、リダイレクト、iframe で許可するドメインを宣言するとき

デプロイ

• 本番環境にリリースする → deploy.md：Alpic 経由でデプロイする準備ができたとき
• ChatGPT/Claude ディレクトリに公開する → publish.md：レビューに提出する準備ができたとき

API ドキュメント全文：https://docs.skybridge.tech/api-reference.md

リリースノートと変更履歴：https://skybridge.tech/changelog.md