Claude MCP (Master Control Program)

Claude MCP（Master Control Program）

Claude のコード生成機能を拡張し、最新のドキュメントやリソースにアクセスできる、強力なサーバーベースのツールシステムです。

🌟 概要

Claude MCP は、最新のフレームワークやライブラリを活用できるよう Claude の機能を強化するツールをホストする、モジュール式のサーバーです。Claude が最新のドキュメントや API にアクセスできるようにすることで、生成されるコードが常に最新のベストプラクティスに従い、最も新しい機能を活用できるようにします。

このシステムは、次の 2 つの主要なモードでデプロイできます。

1. 個人モード：マシン上でローカルに実行し、自分の Claude Code の利用体験を向上させます
2. 共有モード：複数のユーザーやチームがアクセスできるサービスとしてデプロイします

独自のカスタムツールを追加することも、コミュニティが提供するツールを利用することもできます。

🛠️ ツール

MCP システムは、複数の専門ツールをホストするように設計されています。現在、以下のツールが実装されています。

1. ドキュメント取得ツール

フレームワークやライブラリの最新ドキュメントを検出、取得、処理します。

• バージョン検出：npm、PyPI、GitHub から最新バージョンを自動的に検出します
• ドキュメントのスクレイピング：ヘッドレスブラウザーを使用して、公式ドキュメントサイトをスクレイピングします
• コンテンツ処理：関連するコンテンツを抽出し、構造化形式（JSON/Markdown）に変換します
• API リファレンスの処理：包括的に網羅するため、API ドキュメントを個別に処理します
• レート制限への配慮：ウェブサイトのポリシーを遵守するため、インテリジェントにレート制限を適用します
• スマートクローリング：重要なドキュメントページを優先し、サイト構造に合わせて調整します

対応フレームワーク：

• LangChain（Python および JavaScript）
• FastAPI
• React、Vue、Angular、Svelte
• Express、Next.js、Hono、Remix
• その他も簡単に追加できます……

🚀 はじめに

前提条件

• 高速な JavaScript/TypeScript の実行に使用する Bun

インストール

# Clone the repository
git clone https://github.com/yourusername/claude-mcp.git
cd claude-mcp

# Install dependencies
bun install

サーバーの起動

# Development mode (with hot reloading)
bun dev

# Production mode
bun start

サーバーはデフォルトで http://localhost:3000 で実行されます。

デプロイ方法

1. 個人利用／ローカル利用（推奨）

個人利用の場合は、サーバーをローカルで実行するだけです。デフォルトでは、認証やレート制限は適用されません。

# Start the server in development mode
bun dev

2. チーム共有サーバー

チーム内で共有するサーバーでは、基本的な認証を設定できます。

# Create .env file with basic settings
echo "NODE_ENV=production\nAPI_KEY=your-secret-key" > .env

# Start the server
bun start

3. 公開デプロイ

一般公開するサービスでは、すべてのセキュリティ機能を有効にします。

# Configure with all security features
echo "NODE_ENV=production\nAPI_KEY=strong-random-key\nRATE_LIMIT_ENABLED=true" > .env

# Start the server
bun start

4. Docker でのデプロイ

Docker を使用して MCP サーバーを実行することもできます。

# Build and run with Docker
docker build -t claude-mcp .
docker run -p 3000:3000 -v ./docs:/app/docs claude-mcp

# Or use Docker Compose
docker compose up

5. 二重デプロイ（ローカル＋共有）

個人用ツールのローカルインスタンスを実行しながら、共有インスタンスに接続することもできます。

# Run your personal instance on port 3000
bun dev

# In your .zshrc/.bashrc, set up both sources:
export CLAUDE_CODE_PERSONAL_MCP="http://localhost:3000"
export CLAUDE_CODE_TEAM_MCP="https://team-mcp.example.com"

これにより、独自のツールを開発して使用しながら、チームで共有するドキュメントやツールにもアクセスできます。

🔌 Claude との連携

Claude Code CLI との連携

MCP は Claude Code CLI ツールのプラグインとしてインストールでき、すべての MCP ツールを利用できます。

# Install the MCP plugin for Claude Code
curl -X POST http://localhost:3000/claude-code/install

# Source the activation script (or add to your .bashrc/.zshrc)
source ~/.claude-code/plugins/claude-mcp/activate.sh

# Use documentation tools
claude fetch-docs langchain               # Fetch and use LangChain documentation
claude list-versions fastapi              # List available FastAPI versions

# List all available tools
claude tools list                         # See all available tools
claude tools info docs-fetcher            # Get information about a specific tool

# Use any tool directly
claude tool:docs-fetcher frameworks       # List supported frameworks

claude fetch-docs を使用してフレームワークのドキュメントを取得すると、Claude Code はコードの作成時にそのドキュメントを自動的に参照できるようになります。MCP サーバーにツールを追加すると、それらも Claude Code CLI から自動的に利用できるようになります。

HTTP API との連携

Claude は HTTP リクエストを通じて MCP サーバーとやり取りすることもできます。一般的な連携パターンを以下に示します。

1. 最新バージョンの確認

// Claude can generate this code to check the latest version of a framework
const response = await fetch('http://localhost:3000/api/tools/docs-fetcher/latest-version', {
  method: 'POST',
  headers: { 'Content-Type': 'application/json' },
  body: JSON.stringify({ framework: 'langchain' })
});
const data = await response.json();
console.log(`Latest version: ${data.latestVersion}`);

2. ドキュメントの取得

// Add a new framework to the registry
const addResponse = await fetch('http://localhost:3000/api/tools/docs-fetcher/framework', {
  method: 'POST',
  headers: { 'Content-Type': 'application/json' },
  body: JSON.stringify({ 
    name: 'new-framework',
    type: 'npm',
    packageName: 'new-framework',
    docsUrl: 'https://new-framework.dev/docs'
  })
});

// Fetch documentation for a framework
const response = await fetch('http://localhost:3000/api/tools/docs-fetcher/fetch', {
  method: 'POST',
  headers: { 'Content-Type': 'application/json' },
  body: JSON.stringify({ 
    framework: 'fastapi',
    storageFormat: 'markdown',
    processContent: true,
    maxPages: 20     // Limit the number of pages (faster for testing)
  })
});
const data = await response.json();
console.log(`Documentation saved to: ${data.processedDocsLocation}`);

3. ドキュメントのステータス確認

// Claude can check if documentation is already available
const response = await fetch('http://localhost:3000/api/tools/docs-fetcher/status/langchain');
const data = await response.json();

if (data.available && data.upToDate) {
  console.log(`Using cached documentation at version ${data.latestVersion}`);
} else {
  console.log(`Need to fetch latest documentation (version ${data.latestVersion})`);
}

📚 API リファレンス

ベースエンドポイント

• GET / - サーバーのステータスと利用可能なツールの一覧

ドキュメント取得ツール

• GET /api/tools/docs-fetcher/frameworks - サポートされているすべてのフレームワークを一覧表示します

  • クエリパラメーター：
    • type：タイプで絞り込みます（all、npm、python、github、custom）

• POST /api/tools/docs-fetcher/framework - レジストリに新しいフレームワークを追加します

  • 本文：

    {
      "name": "new-framework",
      "type": "npm",
      "packageName": "new-framework",
      "docsUrl": "https://new-framework.dev/docs",
      "apiDocsUrl": "https://api.new-framework.dev"
    }
    

• DELETE /api/tools/docs-fetcher/framework/:name - レジストリからフレームワークを削除します

• POST /api/tools/docs-fetcher/latest-version - フレームワークの最新バージョンを取得します

  • 本文：

    { "framework": "langchain" }
    

• POST /api/tools/docs-fetcher/fetch - ドキュメントを取得して処理します

  • 本文：

    {
      "framework": "fastapi",
      "storageFormat": "json|markdown",
      "processContent": true|false,
      "maxPages": 20
    }
    

• GET /api/tools/docs-fetcher/status/:framework - ドキュメントのステータスを確認します

• POST /api/tools/docs-fetcher/search - ドキュメントを検索します

  • 本文：

    {
      "query": "state management",
      "framework": "react",
      "limit": 10
    }
    

🔍 検索機能

このドキュメントツールには、Claude が関連情報をすばやく見つけられる、堅牢な検索システムが含まれています：

# Search the documentation for a specific term
curl -X POST http://localhost:3000/api/tools/docs-fetcher/search \
  -H "Content-Type: application/json" \
  -d '{"query": "state management", "framework": "react", "mode": "hybrid"}'

検索システムは、自動フォールバック機能を備えた3つのモードをサポートしています：

• semantic：ニューラル埋め込みを使用して意味に基づいてコンテンツを検索します（概念に関するクエリに最適です）
• keyword：完全一致する用語を従来のテキスト検索で探します（API 名の検索に最適です）
• hybrid：両方の方法を組み合わせ、包括的な結果を提供します（デフォルト）

セマンティック検索を利用できない場合、システムはキーワード検索に自動的にフォールバックします。

その他の検索オプション：

{
  "query": "How to handle state in React components",
  "framework": "react",
  "version": "18.0.0",
  "mode": "hybrid",
  "hybridAlpha": 0.7,
  "limit": 20
}

システムには、検索インデックスを再構築して最適化するツールが含まれています：

# Rebuild search indexes
curl -X POST http://localhost:3000/api/tools/docs-fetcher/search/rebuild

# Check search stats
curl http://localhost:3000/api/tools/docs-fetcher/search/stats

検索結果には、Claude がコード生成時に利用できる関連する抜粋とコンテキストが含まれるため、ドキュメントをより簡単に参照でき、利便性も向上します。

✨ 使用例

React のドキュメントを取得する（小規模なサンプル）

# Get a small sample for testing (5 pages)
curl -X POST http://localhost:3000/api/tools/docs-fetcher/fetch \
  -H "Content-Type: application/json" \
  -d '{"framework": "react", "processContent": true, "maxPages": 5}'

ドキュメント全体を取得する

# Get comprehensive documentation (may take several minutes)
curl -X POST http://localhost:3000/api/tools/docs-fetcher/fetch \
  -H "Content-Type: application/json" \
  -d '{"framework": "fastapi", "processContent": true, "maxPages": 100}'

FastAPI の最新バージョンを確認する

curl -X POST http://localhost:3000/api/tools/docs-fetcher/latest-version \
  -H "Content-Type: application/json" \
  -d '{"framework": "fastapi"}'

Claude Code CLI で使用する

Claude Code プラグインのインストール後：

# Fetch latest documentation (small sample for testing)
claude fetch-docs langchain --maxpages 5

# Add a new framework interactively (via CLI)
bun docadd add

# Or fetch documentation for a new framework directly
bun docadd fetch fastapi --max-pages 20

# List available frameworks
claude tool:docs-fetcher frameworks

# Search documentation
claude tool:docs-fetcher search --query "agents" --framework langchain

🧩 アーキテクチャ

システムはモジュール式アーキテクチャを採用しています：

• コアサーバー：高いパフォーマンスを実現するため、Hono と Bun で構築されています
• ツールレジストリ：ツールの管理と読み込みを行う中央レジストリです
• 個別のツール：それぞれ独自のルーター、サービス、機能を備えています

ディレクトリ構成

/
├── src/
│   ├── index.ts          # Main server entry point
│   ├── lib/
│   │   └── tool-registry.ts # Tool management
│   ├── types/
│   │   └── tool.ts       # Type definitions
│   └── tools/
│       └── docs-fetcher/ # Documentation fetcher tool
│           ├── index.ts     # Routes and endpoints 
│           ├── service.ts   # Core functionality
│           ├── registry.ts  # Framework registry
│           ├── scrapers.ts  # Website scrapers
│           └── processors.ts # Content processors
├── docs/                 # Stored documentation
├── package.json
└── tsconfig.json

🔧 システムの拡張

Docs Fetcher に新しいフレームワークを追加する

対話型 CLI ツールを使用して、新しいフレームワークを追加します：

# Run the documentation management tool
bun docadd add

# Follow the interactive prompts to add details about the framework

CLI では、次の項目が順番に表示されます：

1. フレームワーク名（例：react、vue、fastapi）
2. フレームワークのタイプ（NPM パッケージ、Python パッケージ、GitHub リポジトリ、またはカスタム）
3. タイプ固有の情報（パッケージ名、Python パッケージ、または GitHub リポジトリ）
4. メインのドキュメント URL
5. 個別の API ドキュメントがあるかどうか（ある場合はその URL）
6. フレームワークのドキュメントをすぐに取得するオプション

次の追加コマンドも使用できます：

# Fetch documentation for an existing framework
bun docadd fetch fastapi --max-pages 20

# List all registered frameworks
bun docadd list

# List frameworks of a specific type
bun docadd list --type npm

# Remove a framework from the registry
bun docadd remove vue

レジストリへの変更はすべて自動的にディスクに保存され、サーバーを再起動しても保持されます。

新しいツールを作成する

1. ツールのテンプレートディレクトリをコピーします：

   cp -r src/tools/tool-template src/tools/your-tool-name
   

2. テンプレートを使用してツールを実装します：

import { z } from 'zod';
import { zValidator } from '@hono/zod-validator';
import { createToolTemplate } from '../../lib/tool-registry';

// Define validation schemas
const exampleSchema = z.object({
  parameter: z.string().min(1)
});

// Create your tool with the template
const yourTool = createToolTemplate({
  name: 'your-tool-name',
  description: 'What your tool does',
  version: '0.1.0',
  setupRoutes: (router) => {
    // Add your endpoints
    router.post(
      '/example',
      zValidator('json', exampleSchema),
      async (c) => {
        const { parameter } = c.req.valid('json');
        
        // Your implementation here
        
        return c.json({ success: true, result: 'Done!' });
      }
    );
    
    return router;
  }
});

export default yourTool;

3. src/lib/tool-registry.ts にツールを登録します：

   import yourTool from '../tools/your-tool-name';
   
   const tools: Record<string, Tool> = {
     'docs-fetcher': docsFetcher,
     'your-tool-name': yourTool,
     // ...
   };
   

4. ツールは Claude Code CLI から自動的に利用できるようになります：

   claude tool:your-tool-name example
   

🔜 今後の予定

• ベクトルデータベースの最適化：意味をより深く理解できるよう、ベクトル検索を改善します
• 自動更新システム：新しいフレームワークのバージョンを定期的に確認します
• コードサンプルの抽出：コード例を抽出してインデックス化します
• 意味理解：ドキュメント内容の意味解析を強化します
• 対応言語の拡張：英語以外のドキュメントのフィルタリングと処理に対応します
• メモリの最適化：大規模なドキュメントセットのメモリ使用量を削減します
• クラウドへのデプロイ：クラウドへのデプロイとスケーリングに対応します

🔧 高度な設定

レート制限とスクレイピングのオプション

ドキュメント取得機能には、スクレイピングの動作を制御する高度な設定オプションが用意されています。

# Set delay between scraping requests (milliseconds)
SCRAPER_REQUEST_DELAY=2000

# Set maximum concurrent scraping operations
SCRAPER_MAX_CONCURRENT=1

# Control puppeteer browser timeout
PUPPETEER_TIMEOUT=60000

# Enable/disable headless mode for debugging
PUPPETEER_HEADLESS=true

# GitHub API token for higher rate limits
GITHUB_TOKEN=your_github_token

# Content language preferences (default is English-only)
CONTENT_LANGUAGE=en

# Minimum content quality threshold (0-1)
CONTENT_QUALITY_THRESHOLD=0.7

これらの設定により、ウェブサイトのレート制限を守り、ドキュメント取得中のアクセスブロックを防ぎながら、高品質なドキュメントを確保できます。

言語フィルタリング

デフォルトでは、より質の高い結果を得るため、英語のドキュメントを優先します。

• クロール中に英語以外の URL は自動的にスキップされます
• 明示的な英語以外の言語タグ（<html lang="es">）を含むコンテンツはフィルタリングされます
• 非ラテン文字の割合が高いページを検出してフィルタリングします

スクレイパー設定の言語パターンを変更することで、この動作をカスタマイズできます。

セマンティック検索の設定

ベクトルベースのセマンティック検索システムは、次のオプションでカスタマイズできます。

# Search mode (semantic, keyword, hybrid)
SEARCH_DEFAULT_MODE=hybrid

# Default weight between vector and keyword search (0-1, higher = more semantic)
SEARCH_HYBRID_ALPHA=0.7

# Vector dimensions for embeddings (default: 384 for all-MiniLM-L6)
VECTOR_DIMENSIONS=384

# Maximum number of vectors to store
VECTOR_MAX_ELEMENTS=100000

検索リクエストでmodeパラメーターを指定すると、クエリ時に別の検索モードを選択することもできます。

エラー処理と堅牢性

システムの堅牢性を確保するため、いくつかの方法を実装しています。

• 必要に応じて、セマンティック検索からキーワード検索へシームレスに切り替えます
• スクレイピング中のネットワークエラーから自動で復旧し、再試行します
• レート制限を検出し、指数バックオフを行います
• デバッグを容易にするため、すべての操作を詳細にログに記録します
• 大規模なドキュメントセットのメモリを管理します

これにより、システムの一部で問題が発生しても、コード生成タスクでClaudeが全体の機能を引き続き利用できます。

📄 ライセンス

MIT

🤝 コントリビューション

コントリビューションを歓迎します。お気軽にプルリクエストを送信してください。