MCP DEMO について
カスタム MCP サーバーとツールで React および TypeScript のコードを動的に生成する、クライアント・サーバー構成のデモとして説明されている Next.js プロジェクトです。README は主に Next.js の開発サーバー起動方法を記載し、デモの詳細は限られています。
主な機能
- 01Next.js プロジェクト
- 02カスタム MCP サーバーとの連携
- 03React と TypeScript のコード生成
活用シーン
- 01Next.js 開発サーバーの起動
- 02クライアント・サーバー構成のデモ確認
- 03React と TypeScript のコード生成
MCP 対応
プロジェクト説明では、カスタム MCP サーバーと MCP ツールを使って React および TypeScript のコードを動的に生成して返します。README にプロトコルやツールの詳細はありません。
設定
ローカルサーバーの設定はどのクライアントでも共通です。コピーしてクライアントの MCP 設定ファイルに貼り付けてください。
このサーバーのパッケージやリモートエンドポイントはまだ取得できていません。プロジェクトの README の手順に従ってください。
ツール
ローカルサーバーのツールはマシン上で起動して初めて取得できます。メンテナーはまだツール一覧を提供していません。
詳細
これは create-next-app でブートストラップされた Next.js プロジェクトです。
Getting Started
まず、開発サーバーを実行します：
npm run dev
# or
yarn dev
# or
pnpm dev
# or
bun dev
ブラウザで http://localhost:3000 を開いて、結果を確認します。
app/page.tsx を修正することでページの編集を開始できます。ファイルを編集すると、ページは自動的に更新されます。
このプロジェクトは next/font を使用して、Vercel の新しいフォントファミリーである Geist を自動的に最適化してロードします。
Learn More
Next.js の詳細については、以下のリソースを参照してください：
- Next.js Documentation - Next.js の機能と API について学びます。
- Learn Next.js - インタラクティブな Next.js チュートリアルです。
Next.js GitHub リポジトリ をチェックアウトできます。フィードバックと貢献を歓迎します！
Deploy on Vercel
Next.js アプリをデプロイする最も簡単な方法は、Next.js の開発者による Vercel Platform を使用することです。
詳細については、Next.js deployment documentation をご確認ください。
コメント
AI アプリケーションが外部のツールやデータソースに統一的な方法で接続するためのオープンなプロトコルです。クライアントはモデルとの対話を担い、MCP サーバーはツール・リソース・プロンプトテンプレートを提供します。標準メッセージでやり取りするため、1 つのサーバーを複数のクライアントで再利用できます。