「AIにコードを書いてもらう」だけの時代は終わりました。2026年現在、Claude CodeはMCP（Model Context Protocol）を通じて、Figma・Semgrep・Gmailなど数千のツールと直接つながります。設定から実践的な活用パターンまで、この記事で押さえておきましょう。
この記事でわかること
- MCPの仕組みとClaude Codeでの設定方法
- 開発者が今すぐ使える実用的なMCPサーバー
- セキュリティを守りながらMCPを安全に運用するコツ
MCPとは何か｜AIと外部ツールをつなぐ共通規格
MCP（Model Context Protocol）は、Anthropicが2024年に公開したオープンソースの通信規格です。AIモデルと外部のデータソースやツールを接続する「共通の窓口」として機能します。
従来、AIツールと外部サービスを連携するには、ツールごとに個別のAPI統合が必要でした。MCPはこの問題を解決します。1つの規格で複数のツールに接続でき、サーバーを追加するだけで連携先を増やせます。
2026年4月時点で公開されているMCPサーバーは10,000以上。Claude Code以外にも、ChatGPT、Cursor、Gemini、VS Codeなど主要なAIツールがMCPに対応しています。
Claude CodeでのMCP設定方法｜3つの接続パターン
Claude CodeへのMCPサーバー追加は、CLIコマンド1行で完了します。
stdioトランスポート（ローカル実行）
ローカルでプロセスを起動し、標準入出力でJSON-RPCメッセージをやり取りする方式です。ファイルシステムやローカルDBなど、マシン上のリソースに直接アクセスするツールに向いています。
claude mcp add my-server -t stdio -- node server.js
SSEトランスポート（リモート接続）
リモートサーバーにHTTPで接続し、Server-Sent Events（SSE）でレスポンスを受け取る方式です。クラウドサービスやチーム共有のサーバーに使います。
claude mcp add figma-server -t sse http://127.0.0.1:3845/sse
HTTPトランスポート（Streamable HTTP）
SSEと似ていますが、よりシンプルなHTTPベースの接続方式です。最近のMCPサーバーではこちらが増えています。
claude mcp add remote-server -t http https://example.com/mcp
設定の確認と管理
claude mcp list # 登録済みサーバーの一覧
claude mcp remove my-server # サーバーの削除
設定はプロジェクト単位（.mcp.json）またはユーザー単位（~/.claude.json）で保存されます。
Tool Search｜数千のツールを効率的に扱う仕組み
MCPサーバーを大量に接続すると、ツール定義だけでコンテキストを圧迫しそうに思えます。Claude Codeはこの問題をTool Searchで解決しています。
全ツールの定義を事前に読み込むのではなく、タスクに応じて必要なツールだけをオンデマンドで検索・ロードします。従来の「全定義一括読み込み」と比べて、コンテキスト消費を85〜95%削減できるとされています。
つまり、MCPサーバーを多数追加してもパフォーマンスが劣化しにくい設計です。
実用的なMCPサーバー｜開発者がまず入れるべきもの
1. Semgrep｜コード生成と同時にセキュリティスキャン
Semgrepプラグインは、Claude Codeが生成したコードを自動でセキュリティスキャンするMCPサーバーです。
できること
– Semgrep Code : 脆弱性パターンの検出（SQLインジェクション、XSSなど）
– Supply Chain : 依存パッケージの脆弱性チェック
– Secrets : API キーやパスワードのハードコード検出
AIが生成したコードに脆弱性が含まれていた場合、結果がクリーンになるまでコード再生成を促す仕組みがあります。
設定方法
1. Semgrepをインストール（brew install semgrep または pip install semgrep）
2. Claude Codeで /plugin を開き、「Semgrep」を検索してインストール
3. /setup-semgrep-plugin でセットアップ完了
2. Figma｜デザインからコード実装への橋渡し
Figma MCP Serverを使うと、Figmaのデザインデータを直接Claude Codeから参照し、コードに変換できます。
できること
– Figmaで選択したフレームを直接参照してコード生成
– Figmaリンクを貼り付けてデザイン仕様を取得
– デザインシステムのトークン（色、タイポグラフィ）をコードに反映
設定方法
1. Figmaデスクトップアプリで「Preferences > Enable Dev Mode MCP Server」を有効化
2. Claude Codeで接続：
claude mcp add figma-dev-mode-mcp-server -t sse http://127.0.0.1:3845/sse
注意点 : 複数フレームの一括変換や、既存コードへの差分適用はまだ課題が残ります。新規コンポーネントの生成で最も力を発揮します。
3. Google Calendar / Gmail｜スケジュールとメールの操作
Google CalendarとGmailのMCPサーバーは、Claude Codeから直接予定の確認やメール操作を行えるようにします。
活用例
– 「今日の予定を確認して」で1日のスケジュールを取得
– 「来週の空き時間にミーティングを入れて」で予定を作成
– メールの検索・要約・下書き作成
開発作業中にClaude Codeのターミナルから離れずにスケジュール確認やメール対応ができるのがメリットです。
4. Supabase｜バックエンドの操作と管理
Supabase MCPサーバーを使うと、Claude Codeからデータベーススキーマの確認やクエリ実行、マイグレーション管理ができます。Supabaseをバックエンドに使っているプロジェクトでは必須級の連携です。
5. cocoindex-code｜セマンティックなコード検索
通常のgrepは「この文字列を含む行」を検索しますが、cocoindex-codeはコードの意味を理解して検索します。
活用例
– 「ユーザー認証を処理しているコード」で関連する実装を一括発見
– 「エラーハンドリングのパターン」でプロジェクト全体の例外処理を網羅
関数名やクラス名がわからなくても、やりたいことを自然言語で検索できるのが強みです。
セキュリティ上の注意点｜MCPサーバーは「依存パッケージ」と同じ
MCPサーバーは便利ですが、npmパッケージやpipライブラリと同様に、信頼性の確認が必要です。
導入前のチェックリスト
– ソースコードを確認する : コミュニティ製のMCPサーバーは、インストール前にコードを読む
– 最小権限の原則 : 認証情報は必要最小限のスコープで設定する
– 環境変数を使う : シークレットを設定ファイルに直書きせず、${ENV_VAR} で参照する
– .envをコミットしない: .gitignore に追加されているか確認する
公式レジストリ（api.anthropic.com/mcp-registry）に登録されたサーバーは一定の審査を受けていますが、それでもブラインドに信頼するのは避けましょう。
まとめ｜MCPで「コードを書くAI」から「開発全体を支えるAI」へ
MCPの登場により、Claude Codeは単なるコード生成ツールから、開発ワークフロー全体をカバーするハブへと進化しています。
まずはSemgrepでセキュリティスキャンを自動化するところから始めるのがおすすめです。すでにプラグインとして統合されており、設定も簡単です。その後、プロジェクトの必要に応じてFigmaやデータベース連携を追加していくと、段階的にワークフローを拡張できます。
MCPサーバーの数は日々増えています。新しいサーバーが出てきたときに「自分の開発フローのどこに組み込めるか」を考える習慣をつけると、AIとの協業がさらに加速します。