Build This Now
Build This Now
キーボードショートカットステータスラインガイド
Claude for Creative Work コネクタ徹底解説MCPの基本MCP Tool SearchContext7 MCPClaude Code向けMCPサーバー50選以上Cursor MCPサーバーClaude Code検索Claude Code向けブラウザ自動化MCPClaude Codeでソーシャルメディアを自動化するClaude Code用カスタムMCPサーバーの構築Build an MCP ServerMCP Servers Explained
Skills, Subagents, HooksSubagent Sweet SpotCLAUDE.md Best PracticesFix Context Limit
speedy_devvkoen_salo
Blog/Toolkit/MCP/MCP Basics

MCPの基本

Model Context Protocolの基本:サーバープロセスがツール、API、サービスをClaude Codeに共有ワイヤーフォーマットで公開する仕組み。設定、トランスポート、最初のサーバー構築。

設定をやめて、構築を始めよう。

AIオーケストレーション付きSaaSビルダーテンプレート。

企業向けに構築している実績を見る →
speedy_devvWritten by speedy_devvPublished Mar 12, 2026Toolkit hubMCP index

問題: Claude Codeは壁に何度もぶつかります。ファイルの編集やコマンドの実行はできますが、データベースの行、GitHubのイシュー、最新の検索結果が必要になった瞬間、答えはノーです。

すぐに解決する方法: 設定ファイルにサーバーを1つ追加すれば、その壁は消えます。MCP設定ファイルに以下を記述してください:

{
  "mcpServers": {
    "brave-search": {
      "command": "npx",
      "args": ["-y", "@modelcontextprotocol/server-brave-search"],
      "env": { "BRAVE_API_KEY": "your-api-key" }
    }
  }
}

Claude Codeを再起動し、「Next.js 15の最新機能を検索して」と聞くと、ライブ結果がストリームされます。

MCPサーバーとは何か

MCPサーバーは、共有ワイヤーフォーマットを通じてClaude Codeにツールを公開する独立したプログラムです。そのフォーマットの名前がModel Context Protocolです。一度インストールすると、そのプログラムはClaude Codeの横に常駐し、呼び出されると応答します。

2026年の新機能: MCP Tool SearchがClaude Codeに標準搭載されました。サーバー定義をオンデマンドで遅延読み込みし、MCPのコンテキスト消費量を最大95%削減します。多数のサーバーを追加してもコンテキストウィンドウが消えていくことはありません。

Claude Code単体でできることを考えてみてください。ファイル操作。コマンド実行。それだけです。サーバーを1つ接続するだけで、同じセッションから以下のことができるようになります:

  • ウェブからライブページを取得する
  • データベースやAPIに対してクエリを実行する
  • チャットの中からGitHub、Slack、Googleスプレッドシートを操作する
  • 特定の業界向けに作られたニッチなツールを利用する
  • 1つのワークフローで複数のシステムにまたがるステップを連結する
  • ChannelsでTelegramやDiscordと通信する

MCPサーバーの仕組み

各MCPサーバーは独自のプロセスとして動作します。Claude Codeはプロトコルを通じてサーバーと通信し、毎回同じ4つのステップに従います:

  1. 接続: Claude CodeがMCPサーバーへのチャネルを開く
  2. 探索: サーバーが公開するツールと関数の一覧を返す
  3. 統合: それらのツールがClaudeのツールリストに追加される
  4. 実行: Claudeは会話の中でそれらを呼び出せる
// Claude Code CLI: ~/.claude.json or project-level .mcp.json
// Claude Desktop: claude_desktop_config.json
{
  "mcpServers": {
    "brave-search": {
      "command": "npx",
      "args": ["-y", "@modelcontextprotocol/server-brave-search"],
      "env": {
        "BRAVE_API_KEY": "your-api-key"
      }
    }
  }
}

インストールすべき主要MCPサーバー

まず主要なものから始めましょう。初日から多くのビルダーが直面する問題を解決します:

Webアクセスとリサーチ:

  • Brave Search (@modelcontextprotocol/server-brave-search) - Web検索機能
  • Fetch (@modelcontextprotocol/server-fetch) - Webコンテンツの取得と解析

開発ツール:

  • GitHub (@modelcontextprotocol/server-github) - リポジトリのアクセスと管理
  • Git (@modelcontextprotocol/server-git) - ローカルgit操作
  • PostgreSQL (@modelcontextprotocol/server-postgres) - データベースクエリ

ファイル操作:

  • Filesystem (@modelcontextprotocol/server-filesystem) - 拡張ファイル操作
  • Google Drive (@modelcontextprotocol/server-gdrive) - クラウドファイルアクセス

これらはいずれも、上記の例と同じ形式で mcpServers ブロックに追加できます。

各サーバーはそれぞれの機能を追加します。人気MCPサーバーのリストから、日常業務に合ったものを見つけてください。

設定手順

サーバーはJSONに記述します。インストールコマンドはありません。設定は4つの短いステップで完了します:

  1. 設定ファイルの場所を確認する:
  • Claude Code CLI: ~/.claude.json またはプロジェクトルートの .mcp.json
  • Claude Desktop (macOS): ~/Library/Application Support/Claude/claude_desktop_config.json
  • Claude Desktop (Windows): %APPDATA%\Claude\claude_desktop_config.json
  1. サーバー設定を追加する:
{
  "mcpServers": {
    "server-name": {
      "command": "npx",
      "args": ["-y", "@modelcontextprotocol/server-name"],
      "env": { "API_KEY": "your-key-here" }
    }
  }
}
  1. Claude Codeを再起動して新しい設定を読み込みます。

  2. Claude Codeでテストする: Claudeに「利用可能なMCPツールは何ですか?」と聞いて、インストールされた拡張機能を確認します。

よくある設定の問題と修正方法

エラー: "MCP server not found" 修正方法:パッケージがグローバルにインストールされ、パスに存在することを確認します:

# Reinstall with explicit global flag
npm install -g @modelcontextprotocol/server-brave-search

エラー: "Authentication failed"

修正方法:APIキーがシェルでエクスポートされていることを確認します:

# Check environment variables
echo $BRAVE_API_KEY
echo $GITHUB_TOKEN

エラー: "Server connection timeout" 修正方法:Claude Codeを再起動してMCP接続を再構築します。現在のセッションを終了し、新しいセッションを開いてすべてのサーバーをリロードしてください。

クイック有効化/無効化コマンド

うるさいサーバーを無効にするためにJSONを編集する必要はありません。チャットから切り替えることができます:

# Disable a server temporarily
/mcp disable supabase
 
# Re-enable when needed
/mcp enable supabase

サーバーがエラーを出しているとき、またはツールリストがプロンプトを散らかしているときに便利です。設定エントリはそのまま残ります。このセッションのアクティブ状態だけがオフになります。

高度な設定

一部のサーバーはさらなる調整が必要です。カスタムコマンドと環境変数は次のように渡します:

{
  "mcpServers": {
    "custom-server": {
      "command": "node",
      "args": ["path/to/your/server.js"],
      "env": {
        "LOG_LEVEL": "debug",
        "TIMEOUT": "30000"
      }
    }
  }
}

このパターンでできること:

  • 自分のパスからローカルのNode.jsまたはPythonサーバーを実行する
  • キーや調整可能パラメータのカスタム環境変数を設定する
  • 問題が発生したときのデバッグログを有効にする
  • MCP対応サーバーを提供するあらゆるサービスへのブリッジを作る

次のアクション

今日1つ選んで実行しましょう:

  1. 最初のMCPサーバーをインストールする: 即座にWebアクセスが得られるBrave Searchを選ぶ
  2. 人気のオプションを探索する: 厳選されたおすすめが載った人気MCPサーバーガイドを確認する
  3. ブラウザ自動化を設定する: 高度なWeb操作のためのMCPブラウザ自動化について学ぶ
  4. カスタム統合を作成する: カスタムインテグレーションチュートリアルで独自のMCPサーバーを構築する

MCPサーバーを1つ追加するだけで、Claude Codeのすべてのセッションが変わります。今日必要なものを追加してください。次の壁が現れたら、次のものを追加すればいい。試行錯誤を省きたい場合は、ClaudeFastのCode Kitが18エージェントシステムとともに厳選されたMCPサーバー設定を提供しているので、最初のセッションからすでに準備が整っています。

Continue in MCP

  • Claude Code向けMCPサーバー50選以上
    Claude Code向けのMCPサーバー50選以上: エディタ統合、使用量モニター、オーケストレーター、データベースコネクター、ブラウザドライバー、今すぐ導入する価値のあるスターターキット。
  • Claude Code向けブラウザ自動化MCP
    MCPを経由してPlaywrightやPuppeteerをClaude Codeに接続し、自然言語のプロンプトで実際のブラウザを操作。スクレイピング、QA、回帰テストのクリック操作をセレクター不要で実現。
  • How to Build an MCP Server for Claude Code
    A step-by-step tutorial: build a minimal MCP server in Node and TypeScript, expose one tool over stdio, and register it with Claude Code via claude mcp add and a project .mcp.json.
  • Claude for Creative Work コネクタ徹底解説
    Anthropic公式の9つのコネクタが、ClaudeをBlender、Adobe Creative Cloud、Autodesk Fusion、Ableton、Splice、Affinity、SketchUp、Resolumeに直結します。
  • Context7 MCP
    Context7 MCPをClaude Codeに追加することで、プロンプト実行時に最新のライブラリドキュメントを取得。古いトレーニングデータの推測、存在しないAPIの生成、関数名の変更問題を解消。
  • Cursor MCPサーバー
    Cursor IDEでMCPサーバーを設定する方法。.cursor/mcp.jsonの場所、CursorのJSONフォーマット、検索・git・ブラウザ用に最初に追加すべきサーバーを解説。

More from Toolkit

  • CLAUDE.md, Skills, Subagents, Hooks: When to Use Which
    Claude Code skills vs subagents vs hooks vs CLAUDE.md: a plain mental model for picking the right primitive, with token costs and examples.
  • Claude Code Subagents: The 3 to 5 Agent Sweet Spot
    Claude code subagents work best at 3-5 concurrent agents. Here is why that ceiling exists, how to set them up, and what to use past it.
  • CLAUDE.md Best Practices: The File That Makes Claude Code Reliable
    CLAUDE.md best practices: keep it under 200 lines, write it by hand, and use hooks when you need real enforcement, not advice.
  • How to Fix Claude Code Running Out of Context
    Claude Code running out of context is a session design problem. Fix it with /compact, lean CLAUDE.md, skills, and subagents, not a bigger window.

設定をやめて、構築を始めよう。

AIオーケストレーション付きSaaSビルダーテンプレート。

企業向けに構築している実績を見る →

Claude for Creative Work コネクタ徹底解説

Anthropic公式の9つのコネクタが、ClaudeをBlender、Adobe Creative Cloud、Autodesk Fusion、Ableton、Splice、Affinity、SketchUp、Resolumeに直結します。

MCP Tool Search

MCP Tool SearchはClaude Codeのツール定義をコンテキストウィンドウの10%を超えた時点で遅延読み込みし、アイドル状態のMCPサーバーから数万トークンを取り戻します。

On this page

MCPサーバーとは何か
MCPサーバーの仕組み
インストールすべき主要MCPサーバー
設定手順
よくある設定の問題と修正方法
クイック有効化/無効化コマンド
高度な設定
次のアクション

設定をやめて、構築を始めよう。

AIオーケストレーション付きSaaSビルダーテンプレート。

企業向けに構築している実績を見る →