Payload CMS MCP Server

MIT License
82
21
  • Linux
  • Apple

remote-capable server

The server can be hosted and run remotely because it primarily relies on remote services or has no dependency on the local environment.

Integrations

  • Includes ESLint configuration when scaffolding Payload CMS projects for code quality and consistency.

  • Supports using MongoDB as a database option when scaffolding Payload CMS projects.

  • Supports Node.js environment for running Payload CMS projects, with specific version requirements (Node.js 18+).

🚀 ペイロード CMS 3.0 MCP サーバー

📋 概要

Payload CMS 3.0 MCPサーバーは、Payload CMS開発エクスペリエンスを向上させるために設計された、専用のモデルコンテキストプロトコルサーバーです。コード検証、テンプレート生成、そしてベストプラクティスに基づいたプロジェクトスキャフォールディング機能を提供することで、開発者がより優れたPayload CMSアプリケーションを構築できるよう支援します。

✨ 特徴

🔧 ペイロードCMS 3.0の機能

検証ツール

  • validate - コレクション、フィールド、グローバル、および構成のコードを検証します
  • query - クエリ検証ルールとベストプラクティス
  • mcp_query - ペイロードCMS構造に対してSQLのようなクエリを実行する

コード生成

  • generate_template - さまざまなコンポーネントのコードテンプレートを生成する
  • generate_collection - 完全なコレクション定義を作成する
  • generate_field - 適切な型でフィールド定義を生成する

プロジェクトのセットアップ

  • scaffold_project - ペイロードCMSプロジェクト構造全体を作成する
  • validate_scaffold_options - スキャフォールドオプションがベストプラクティスに従っていることを確認する(scaffold_project によって内部的に使用される)

📝 詳細なツールリファレンス

検証ツール

validate

ペイロード CMS コードの構文とベスト プラクティスを検証します。

パラメータ:

  • code (文字列): 検証するコード
  • fileType (列挙型): ファイルのタイプ - 「collection」、「field」、「global」、または「config」

プロンプトの例:

Can you validate this Payload CMS collection code? ```typescript export const Posts = { slug: 'posts', fields: [ { name: 'title', type: 'text', required: true, }, { name: 'content', type: 'richText', } ], admin: { useAsTitle: 'title', } }

query

Payload CMS の検証ルールとベスト プラクティスをクエリします。

パラメータ:

  • query (文字列): クエリ文字列
  • fileType (オプションの列挙型): ファイルのタイプ - 「collection」、「field」、「global」、または「config」

プロンプトの例:

What are the best practices for implementing access control in Payload CMS collections?

mcp_query

Payload CMS 構造に対して SQL のようなクエリを実行します。

パラメータ:

  • sql (文字列): SQLのようなクエリ文字列

プロンプトの例:

Can you execute this query to find all valid field types in Payload CMS? SELECT field_types FROM payload_schema WHERE version = '3.0'

コード生成

generate_template

さまざまな Payload CMS コンポーネントのコード テンプレートを生成します。

パラメータ:

  • templateType (列挙型): テンプレートのタイプ - 「collection」、「field」、「global」、「config」、「access-control」、「hook」、「endpoint」、「plugin」、「block」、「migration」
  • options (レコード): テンプレートの設定オプション

プロンプトの例:

Generate a template for a Payload CMS hook that logs when a document is created.

generate_collection

完全なペイロード CMS コレクション定義を生成します。

パラメータ:

  • slug (文字列):コレクションスラッグ
  • fields (オプション配列): フィールドオブジェクトの配列
  • auth (オプションのブール値): これが認証コレクションであるかどうか
  • timestamps (オプションのブール値): タイムスタンプを含めるかどうか
  • admin (オプションオブジェクト):管理パネルの設定
  • hooks (オプションのブール値):フックを含めるかどうか
  • access (オプションのブール値): アクセス制御を含めるかどうか
  • versions (オプションのブール値): バージョン管理を有効にするかどうか

プロンプトの例:

Generate a Payload CMS collection for a blog with title, content, author, and published date fields. Include timestamps and versioning.

generate_field

ペイロード CMS フィールド定義を生成します。

パラメータ:

  • name (文字列): フィールド名
  • type (文字列): フィールドタイプ
  • required (オプションのブール値): フィールドが必須かどうか
  • unique (オプションのブール値):フィールドが一意であるかどうか
  • localized (オプションのブール値): フィールドをローカライズするかどうか
  • access (オプションのブール値): アクセス制御を含めるかどうか
  • admin (オプションオブジェクト):管理パネルの設定
  • validation (オプションのブール値):検証を含めるかどうか
  • defaultValue (オプション any): フィールドのデフォルト値

プロンプトの例:

Generate a Payload CMS image field with validation that requires alt text and has a description in the admin panel.

プロジェクトのセットアップ

scaffold_project

完全な Payload CMS プロジェクト構造を構築します。

パラメータ:

  • projectName (文字列): プロジェクトの名前
  • description (オプションの文字列): プロジェクトの説明
  • serverUrl (オプションの文字列): サーバーURL
  • database (オプションの列挙型): データベースの種類 - 「mongodb」または「postgres」
  • auth (オプションのブール値): 認証を含めるかどうか
  • admin (オプションオブジェクト):管理パネルの設定
  • collections (オプションの配列):コレクションオブジェクトの配列
  • globals (オプション配列): グローバルオブジェクトの配列
  • blocks (オプション配列):ブロックオブジェクトの配列
  • plugins (オプション配列): プラグイン文字列の配列
  • typescript (オプションのブール値): TypeScriptを使用するかどうか

プロンプトの例:

Scaffold a Payload CMS project called "blog-platform" with MongoDB, authentication, and collections for posts, categories, and users. Include a global for site settings.

🚀 はじめに

1. 前提条件

始める前に、次のものを用意してください。

  • Node.js 18+ (Payload CMS 3.0 に必要)
  • 有効な鉄道アカウント
  • Railway API トークン ( railway.app/account/tokensで作成)
  • Payload CMS 3.0 の概念に関する基本的な知識

2. カーソルを設定する

カーソル IDE で使用するには:

  1. カーソル設定を開く
  2. MCPサーバーセクションへ移動
  3. 新しいMCPサーバーを追加する
  4. 「Payload CMS 3.0 MCP」と名付けます
  5. トランスポートタイプを「コマンド」に設定する
  6. コマンドを次のように設定します: railway run --service=YOUR_SERVICE_ID
  7. 設定を保存する

3. MCPサーバーの使用

設定が完了すると、AI プロンプトで次のツールを使用できるようになります。

  • コード検証: 「このペイロード CMS コレクション コードを検証する」
  • テンプレート生成: 「メディアコレクションのテンプレートを生成する」
  • クエリルール: 「アクセス制御のクエリ検証ルール」
  • SQL のようなクエリ: 「コレクションのフィールド タイプを検索するクエリを実行する」

4. ワークフローの例

Payload CMS MCP サーバーを使用した一般的なワークフロー:

  1. 特定のフィールドを持つコレクションテンプレートを生成する
  2. 生成されたコードをベストプラクティスに従って検証する
  3. コードを改善するための特定の検証ルールをクエリする
  4. フックやエンドポイントなどの追加コンポーネントを生成する
  5. 準備ができたら完全なプロジェクト構造を構築する

5. 完全なワークフローの例

会話で MCP サーバーを使用する方法の完全な例を次に示します。

User: I need to create a Payload CMS collection for a product catalog. AI: I'll help you create a product catalog collection. Let me generate a template for you. [Uses generate_collection tool] Here's a collection template for your product catalog: ```typescript import { CollectionConfig } from 'payload/types'; export const Products: CollectionConfig = { slug: 'products', admin: { useAsTitle: 'name', defaultColumns: ['name', 'price', 'category', 'inStock'], group: 'Shop', }, access: { read: () => true, }, fields: [ { name: 'name', type: 'text', required: true, }, { name: 'description', type: 'richText', }, { name: 'price', type: 'number', required: true, }, { name: 'category', type: 'relationship', relationTo: 'categories', required: true, }, { name: 'images', type: 'array', fields: [ { name: 'image', type: 'upload', relationTo: 'media', required: true, }, { name: 'altText', type: 'text', required: true, } ] }, { name: 'inStock', type: 'checkbox', defaultValue: true, }, ], timestamps: true, }

ユーザー: このコードがベストプラクティスに従っているかどうか検証できますか?

AI: コードを検証します。

[検証ツールを使用]

検証結果によると、コードは有効であり、ベストプラクティスに準拠しています。以下にいくつか提案があります。

  1. 深いクエリを防ぐために、カテゴリ関係フィールドにmaxDepthを追加することを検討してください。
  2. 作成、更新、削除操作にアクセス制御を追加したい場合があります
  3. 製品が更新されたときに在庫管理用のフックを追加することを検討してください

ユーザー: Payload CMS におけるアクセス制御のベストプラクティスは何ですか?

AI: アクセス制御の検証ルールを照会してみましょう。

[クエリツールを使用]

Payload CMS でのアクセス制御のベスト プラクティスは次のとおりです。

  1. 作成、読み取り、更新、削除の各操作に対して、明示的なアクセス制御関数を常に定義します。
  2. 管理者ユーザーに対してロールベースのアクセス制御を使用する
  3. 機密データに対するフィールドレベルのアクセス制御を実装する
  4. 幅広い権限に対してコレクションレベルのアクセス制御を使用する
  5. 複雑なロジックの場合は、アクセス制御と併せてフックを使用することを検討してください。

ユーザー: ここで、この製品コレクションとカテゴリ コレクションを使用して完全なプロジェクトをスキャフォールディングする必要があります。

AI: 完全なプロジェクトをスキャフォールディングします。

[scaffold_projectツールを使用]

次のような完全な Payload CMS プロジェクト構造を生成しました。

  • ご指定の商品コレクション
  • 名前と説明フィールドを持つカテゴリコレクション
  • 製品画像のメディアコレクション
  • 管理者ユーザーの認証
  • TypeScriptの設定
  • MongoDBデータベースのセットアップ
  • 必要なすべてのファイルと設定

プロジェクトは、 npm installおよびnpm run devで初期化する準備が整いました。

📋 スキャフォールディングの例と詳細なプロンプト

プロジェクトの足場の例

MCPサーバーを使用してプロジェクトをスキャフォールディングすると、完全なプロジェクト構造が得られます。スキャフォールディングされたeコマースプロジェクトは次のようになります。

e-commerce-platform/ ├── .env ├── .eslintrc.js ├── .gitignore ├── README.md ├── package.json ├── tsconfig.json ├── src/ │ ├── payload.config.ts │ ├── server.ts │ ├── collections/ │ │ ├── Products.ts │ │ ├── Categories.ts │ │ ├── Orders.ts │ │ ├── Customers.ts │ │ ├── Media.ts │ │ └── Users.ts │ ├── globals/ │ │ ├── Settings.ts │ │ └── Footer.ts │ ├── blocks/ │ │ ├── Hero.ts │ │ ├── ProductGrid.ts │ │ └── CallToAction.ts │ ├── fields/ │ │ ├── richText/ │ │ ├── metaImage.ts │ │ └── slug.ts │ ├── hooks/ │ │ ├── beforeChange.ts │ │ └── afterChange.ts │ ├── access/ │ │ ├── isAdmin.ts │ │ └── isAdminOrSelf.ts │ └── utilities/ │ ├── formatSlug.ts │ └── sendEmail.ts

スキャフォールディングプロジェクトプロンプトの例(基本)

Scaffold a Payload CMS project for a blog platform with the following: - Project name: blog-platform - Database: MongoDB - Authentication: Yes - Collections: Posts, Categories, Authors, Media - Globals: SiteSettings - TypeScript: Yes

Scaffold プロジェクト プロンプトの例 (詳細)

Scaffold a comprehensive Payload CMS project for an e-commerce platform with the following specifications: Project details: - Name: luxury-watches-store - Description: "An e-commerce platform for luxury watches" - Database: PostgreSQL - TypeScript: Yes Collections needed: 1. Products collection with: - Name (text, required) - Description (rich text) - Price (number, required) - SKU (text, unique) - Brand (relationship to Brands collection) - Categories (relationship to Categories, multiple) - Features (array of text fields) - Specifications (array of key-value pairs) - Images (array of media uploads with alt text) - Stock quantity (number) - Status (select: available, out of stock, discontinued) 2. Categories collection with: - Name (text, required) - Description (rich text) - Parent category (self-relationship) - Image (media upload) 3. Brands collection with: - Name (text, required) - Logo (media upload) - Description (rich text) - Founded year (number) - Country of origin (text) 4. Orders collection with: - Order number (text, generated) - Customer (relationship to Users) - Products (array of relationships to Products with quantity) - Status (select: pending, processing, shipped, delivered, cancelled) - Shipping address (group of fields) - Billing address (group of fields) - Payment method (select) - Total amount (number, calculated) - Notes (text) 5. Users collection (auth enabled) with: - Email (email, required) - Name (text, required) - Shipping addresses (array of address groups) - Order history (relationship to Orders) - Wishlist (relationship to Products) - Role (select: customer, admin) Globals: 1. SiteSettings with: - Site name - Logo - Contact information - Social media links - SEO defaults 2. ShippingMethods with: - Array of shipping options with prices Include access control for: - Admin-only access to manage products, categories, brands - Customer access to their own orders and profile - Public read access to products and categories Add hooks for: - Updating stock when orders are placed - Generating order numbers - Sending email notifications on order status changes

コレクション作成プロンプトの例(基本)

Generate a Payload CMS collection for blog posts with title, content, author, and published date fields.

コレクション作成プロンプトの例(詳細)

Generate a Payload CMS collection for a real estate property listing with the following specifications: Collection name: Properties Admin configuration: - Use "title" as the display field - Group under "Listings" in the admin panel - Default columns: title, price, location, status, createdAt Fields: 1. Title (text, required) 2. Slug (text, unique, generated from title) 3. Description (rich text with basic formatting options) 4. Price (number, required) 5. Location (group) with: - Address (text) - City (text, required) - State/Province (text, required) - Postal code (text) - Country (select from predefined list) - Coordinates (point) for map display 6. Property details (group) with: - Property type (select: house, apartment, condo, land, commercial) - Bedrooms (number) - Bathrooms (number) - Square footage (number) - Lot size (number) - Year built (number) - Parking spaces (number) 7. Features (array of checkboxes) including: - Air conditioning - Swimming pool - Garden - Garage - Fireplace - Security system - Elevator - Furnished 8. Images (array of media uploads with alt text and caption) 9. Documents (array of file uploads for floor plans, certificates, etc.) 10. Status (select: available, under contract, sold, off market) 11. Featured (checkbox to highlight on homepage) 12. Agent (relationship to Users collection, required) 13. Related properties (relationship to self, multiple) Access control: - Public read access - Agent can create and edit their own listings - Admin can manage all listings Hooks: - Before change: Format slug from title - After change: Notify agent of status changes Versioning: Enabled Timestamps: Enabled

プロンプトの詳細レベル

MCP サーバーは、さまざまな詳細レベルのプロンプトを処理できます。

最小限の詳細(AIがギャップを埋めます)

Generate a collection for blog posts.

中程度の詳細(特定の要件)

Generate a collection for blog posts with title, content, featured image, categories, and author fields. Make title and content required.

ハイディテール(完全仕様)

Generate a collection for blog posts with: - Slug: posts - Fields: - Title (text, required) - Content (rich text with custom formatting options) - Featured image (upload with alt text) - Categories (relationship to categories collection, multiple) - Author (relationship to users collection) - Status (select: draft, published, archived) - Published date (date) - SEO (group with title, description, and keywords) - Admin configuration: - Use title as display field - Group under "Content" - Default columns: title, author, status, publishedDate - Access control for different user roles - Hooks for slug generation and notification - Enable versioning and timestamps

効果的なプロンプトのヒント

  1. 要件を具体的に指定します。詳細を多く指定するほど、出力はよりカスタマイズされたものになります。
  2. 関係を指定する: コレクションが互いにどのように関連しているかを明確に示します。
  3. 検証のニーズを含める: フィールドの検証ルールまたは制約をすべて記載します。
  4. 管理 UI の設定を記述: 管理パネルでコレクションをどのように表示するかを指定します。
  5. フックとアクセス制御について言及する: 特定のビジネス ロジックまたはセキュリティ ルールが必要な場合は、プロンプトにそれらを含めます。
  6. ドメイン固有の用語を使用する: 業界やユースケースに関連する用語を使用してプロジェクトを説明します。

📄 ライセンス

このプロジェクトは MIT ライセンスに基づいてライセンスされています - 詳細については LICENSE ファイルを参照してください。

🌍 MATMAX WORLDWIDEについて

私たちは、人間性を尊重しながら生活を豊かにするツールである、善のためのテクノロジーを信じています。

テクノロジーが健康、つながり、そして人生の目的に役立つ未来を共に築きましょう。共に、私たち一人ひとりの最高の部分を引き出すデジタル体験を創造しましょう。

人間中心のテクノロジーに関する当社のビジョンの詳細については、 matmax.worldをご覧ください。

🖥️ ローカルで実行

npm を使用して Payload CMS MCP サーバーをローカルで実行できます。

オプション1: npmからインストールする

# Install globally npm install -g payload-cms-mcp # Run the server payload-cms-mcp

オプション2: リポジトリをクローンする

  1. リポジトリをクローンします。
git clone https://github.com/Matmax-Worldwide/payloadcmsmcp.git cd payloadcmsmcp
  1. 依存関係をインストールします:
npm install
  1. サーバーをローカルで実行します。
npm run dev

あるいは、次のようにも言えます。

npm run local

MCP サーバーはローカルで実行され、Railway API トークンを必要とせずに開発およびテストのためにアクセスできるようになります。

🚀 展開オプション

鉄道への展開(推奨)

MCP サーバーを展開する最も簡単な方法は、Railway のワンクリック展開を使用することです。

ボタンをクリックした後:

  1. 「GitHubリポジトリからデプロイ」を選択します
  2. 「Matmax-Worldwide/payloadcmsmcp」を検索
  3. 「今すぐデプロイ」をクリック

クイックカーソルIDEセットアップ

展開後:

  1. Railway CLI をインストールします: npm install -g @railway/cli
  2. 鉄道へのログイン: railway login
  3. プロジェクトへのリンク: railway link
  4. カーソル設定 > MCP サーバーで、コマンドを「 railway runに設定します。
ID: g6zzhp2xr8