mcpField
R
resource-design

resource-design

github.com/xmcp-dev開発048 回インストール36 週間前に更新
リポジトリ

resource-design について

resource-designは、xmcpでリソースを作成する開発者向けのスキルです。要件を対話形式で確認し、ファイルベースのルーティング規約に沿って静的・動的・ファイル型リソースの実装を案内します。

主な機能

  1. 01リソース要件の対話的な確認
  2. 02静的・動的・ファイル型リソース
  3. 03ファイルベースのURIルーティング
  4. 04動的パラメーターとスキーマ
  5. 05メタデータとハンドラーの戻り値

活用シーン

  1. 01設定やドキュメントのリソース作成
  2. 02パラメーター付きユーザープロフィール作成
  3. 03ファイル内容のリソース化

MCP 対応

xmcpリソースの作成を案内し、MCPクライアントからのアクセスに対応します。

インストール

コマンドをコピーしてターミナルで実行します。

$npx skills add https://github.com/xmcp-dev/skills --skill resource-design

インストール後、Claude Code で/resource-designを入力して読み込まれたか確認します。

同梱ファイルreferences/patterns.md

詳細

xmcp リソースの作成

ユーザーが新しい xmcp リソースを作成できるよう支援します。次の対話型ワークフローに従ってください。

ステップ 1:情報を収集する

コードを生成する前に、AskUserQuestion を使って次の質問をユーザーに尋ねてください。

  1. リソース名(指定されていない場合):リソース名は何にしますか?(ケバブケースを使用します)

  2. リソースタイプ:必要なリソースのタイプを尋ねます。

    • 静的 - 変更されない固定コンテンツ(設定、ドキュメント)
    • 動的 - パラメーターに依存するコンテンツ(ユーザープロフィール、レポート)
    • ファイルベース - ファイルから読み込むコンテンツ(ログ、データファイル)
  3. URI パターン:リソースにどのようにアクセスしますか?

    • シンプル:config://app または docs://readme
    • パラメーター付き:users://[userId]/profile
    • ネスト:reports://[year]/[month]/summary
  4. コンテンツの詳細:

    • コンテンツの内容は何ですか?
  5. ウィジェットのサポート(任意):OpenAI ウィジェットのレンダリングが必要かどうかを尋ねます。

ステップ 2:リソースを生成する

ルーティング規則に従って、src/resources/ にリソースファイルを作成します。

ファイルの場所とルーティング

リソースでは、Next.js と同様のファイルベースのルーティングを使用します。

src/resources/
├── (config)/              # Route group (not in URI)
│   └── app.ts            # → config://app
├── (users)/
│   └── [userId]/         # Dynamic segment
│       └── profile.ts    # → users://[userId]/profile
└── docs/
    └── readme.ts         # → docs://readme

ルーティング規則:

  • (folder) - URI パスから除外されるルートグループ
  • [param] - 動的パラメーターセグメント
  • ファイル名が URI の最後のセグメントになります

リソース構造のリファレンス

すべての xmcp リソースには、主なエクスポートが 2 つあります。

// 1. Metadata (optional) - Resource configuration
export const metadata: ResourceMetadata = { /* ... */ };

// 2. Handler (required) - Default export function
export default function handler(params?) { /* ... */ }

// 3. Schema (optional) - For dynamic resources with parameters
export const schema = { /* ... */ };

クイックリファレンス

必須のインポート
import { type ResourceMetadata } from "xmcp";

// For dynamic resources
import { z } from "zod";
import { type InferSchema, type ResourceMetadata } from "xmcp";
メタデータのフィールド
フィールド型必須説明
namestringいいえ*一意のリソース識別子
titlestringいいえ人が読めるタイトル
descriptionstringいいえこのリソースが提供する内容
mimeTypestringいいえコンテンツタイプ(デフォルト:text/plain)
sizenumberいいえコンテンツのサイズ(バイト単位)
_metaobjectいいえベンダー拡張(OpenAI など)

*メタデータが省略された場合、xmcp はファイル名をリソース名として使用します。

ハンドラーの戻り値の型
戻り値の型用途
stringシンプルなテキストコンテンツ
{ text: string }明示的なテキストコンテンツ
{ blob: Uint8Array, mimeType: string }バイナリコンテンツ
JSON.stringify(data)JSON コンテンツ

詳細テンプレート

次の内容を含む完全なコードテンプレートについては:

  • 静的リソースのパターン
  • パラメーター付きの動的リソース
  • ファイルベースのリソース
  • ネストされたルーティングの例
  • OpenAI メタデータの例

references/patterns.md を読んでください


生成後のチェックリスト

  1. 正しい src/resources/ の場所にファイルが作成されている
  2. メタデータを使用する場合、説明的な name と description が設定されている
  3. スキーマのすべてのパラメーターに .describe() が使用されている(動的な場合)
  4. ハンドラーが適切なコンテンツタイプを返す
  5. ファイルパスが意図した URI パターンと一致している

リソースが正しくコンパイルされることを確認するため、pnpm build の実行を提案してください。

コメント