資料をダウンロード
無料カウンセリング
無料カウンセリング

WithCodeMedia-1-pc
previous arrowprevious arrow
next arrownext arrow

WithCodeMedia-1-sp
previous arrowprevious arrow
next arrownext arrow

MCPサーバー自作入門｜Claude Codeと外部ツールをつなぐ実践ガイド

AI
生徒

MCPサーバーって自分で作れるんですか？Claude Codeに自分のツールをつなげたいんですけど…

ペン博士

MCPはAnthropicが公開したオープンなプロトコルで、SDKを使えば自分でサーバーを作ってAIにツールを追加できるんだ。一緒に最小構成を作ってみよう！

MCP（Model Context Protocol）は、AIアシスタントに外部ツールやデータソースを接続するためのオープン規格です。Anthropicが2024年に公開し、Claude CodeやClaude Desktopをはじめ、多くのAIクライアントが対応しています。

この記事では、MCPサーバーを自作する意義から始めて、Node.js SDKを使った最小構成のサーバー作成・Claude Codeとは？でも紹介しているClaude Codeへの登録・ツール実装例・動作確認まで、実際のコードを交えながら解説します。仕様は流動的なので、最新の情報はMCP公式ドキュメントで必ず確認してください。

目次

MCPとは何か？なぜ自作するのか

MCPの仕組み（3者の関係）

MCPを一言でいえばAIと外部ツールの間のUSBのような規格です。AIクライアント（例：Claude Code）が「ツールを呼び出したい」と思ったとき、MCPサーバーがその橋渡しをします。

登場人物役割
AIクライアントClaude Code等。ツールを呼び出す側
MCPサーバー自作する部分。ツールを実装して公開する
外部ツール・APIファイル操作・DB・Slack API等。サーバーが呼ぶ先

既存の公開MCPサーバー（ファイル操作・ブラウザ操作など）でカバーできない自社固有のAPIや社内ツールと連携したいときに、自作が必要になります。たとえば「社内の案件管理DBをClaudeから参照したい」「独自APIを叩いてデータを返したい」といったケースです。

Claude CodeのMCPとは？では既存サーバーの使い方を詳しく解説しています。この記事は自作に踏み込んだ実践編です。

事前準備：必要な環境を整える

環境セットアップ手順

Node.js版SDKを使います。Node.js 18以上が必要です。バージョンを確認してから始めましょう。

  1. Node.jsのバージョン確認
  2. 作業ディレクトリを作る
  3. package.jsonを初期化してSDKをインストール
# Node.jsのバージョン確認（18以上が必要）
node -v

# 作業ディレクトリを作って移動
mkdir my-mcp-server
cd my-mcp-server

# package.json を初期化
npm init -y

# MCP Node.js SDK をインストール
npm install @modelcontextprotocol/sdk

SDKのバージョンや正確なパッケージ名は変わることがあります。最新はGitHub上のSDKリポジトリで確認してください。

package.jsonの設定

ESModules形式で書くため、package.json に "type": "module" を追記します。

{
  "name": "my-mcp-server",
  "version": "1.0.0",
  "type": "module",
  "main": "server.js",
  "scripts": {
    "start": "node server.js"
  },
  "dependencies": {
    "@modelcontextprotocol/sdk": "^1.0.0"
  }
}

バージョン番号はインストール時に決まった番号に合わせてください。

公式サイトから無料カウンセリングに申し込む →

最小構成のMCPサーバーを作る

server.jsの構成ポイント

ツールを1つだけ持つ最小構成のサーバーを作ります。今回は「今の日時を返す」シンプルなツールを実装します。

// server.js
import { McpServer } from '@modelcontextprotocol/sdk/server/mcp.js';
import { StdioServerTransport } from '@modelcontextprotocol/sdk/server/stdio.js';
import { z } from 'zod';

// MCPサーバーを初期化
const server = new McpServer({
  name: 'my-mcp-server',
  version: '1.0.0',
});

// ツールを登録：get_current_time
server.tool(
  'get_current_time',              // ツール名
  '現在の日時を日本時間で返す',   // 説明（AIが判断に使う）
  {},                              // 入力スキーマ（今回は引数なし）
  async () => {
    const now = new Date().toLocaleString('ja-JP', {
      timeZone: 'Asia/Tokyo',
    });
    return {
      content: [{ type: 'text', text: `現在の日時（JST）: ${now}` }],
    };
  },
);

// stdio で起動（Claude Code から呼び出し可能になる）
const transport = new StdioServerTransport();
await server.connect(transport);

SDKの具体的なクラス名・メソッド名はバージョンによって変わる可能性があります。上記はあくまで構造を理解するための雛形として参照し、実装時は最新のSDK公式ドキュメントとサンプルコードを確認してください。

引数を受け取るツールの実装例

引数ありのツールも同じパターンで作れます。zodでスキーマを定義して入力を検証するのが標準的な書き方です。

// 文字列を大文字に変換するツール（引数ありの例）
server.tool(
  'to_uppercase',
  '指定したテキストを大文字に変換して返す',
  {
    text: z.string().describe('大文字にしたいテキスト'),
  },
  async ({ text }) => {
    return {
      content: [{ type: 'text', text: text.toUpperCase() }],
    };
  },
);

zodの型定義（z.string()・z.number()など）と .describe() で書いた説明が、AIがツールを正しく呼ぶためのヒントになります。引数の説明は丁寧に書きましょう。

公式サイトから無料カウンセリングに申し込む →

Claude Codeへの登録方法

Claude Codeへの登録3ステップ

作ったサーバーをClaude Codeから使えるようにするには、設定ファイルにサーバーの起動コマンドを登録します。

  1. プロジェクトルートに .claude/settings.json を作る（または既存に追記）
  2. mcpServers セクションにサーバー情報を記述する
  3. Claude Code を再起動してサーバーを認識させる
{
  "mcpServers": {
    "my-mcp-server": {
      "command": "node",
      "args": ["/絶対パスで指定/my-mcp-server/server.js"],
      "env": {}
    }
  }
}

パスは必ず絶対パスで書いてください。相対パスだと動かないことがあります。環境変数（APIキーなど）が必要な場合は env オブジェクトに記述します。設定ファイルの正確な場所や形式は最新の公式ドキュメントで確認してください。

# 設定ファイルの場所を確認するコマンド（Claude Code CLIの場合）
claude mcp list

動作確認の方法

MCP Inspectorを使うと、サーバーをブラウザから視覚的にテストできます。Claude Codeなしでツールの動作を確認できるので、開発中のデバッグに便利です。

# MCP Inspector でサーバーをテスト
npx @modelcontextprotocol/inspector node server.js

コマンドを実行するとブラウザが開き、登録したツール一覧・引数入力欄・実行ボタンが表示されます。「get_current_time」を実行して日時が返ってきたら成功です。

Claude Codeを経由して確認したい場合は、設定登録後にClaude Codeのチャットで「get_current_timeを使って今の時刻を教えて」と聞いてみてください。サーバーが正しく動いていれば日時が返ってきます。

よくあるハマりどころ

トラブル別の対処法

MCPサーバー自作でつまずきやすいポイントをまとめます。

症状原因の可能性対処法
サーバーが認識されないパスが相対パスになっている設定ファイルのパスを絶対パスに直す
ツールが呼ばれないツール名や説明が不明瞭説明文をより具体的に書き直す
起動時にエラーが出るNode.jsのバージョンが古いnode -v で確認して18以上にアップ
import文でエラーpackage.jsonにtype:moduleがない“type”: “module” を追記
SDKのAPIが合わないSDKバージョンの違い最新SDKドキュメントと公式サンプルを確認

仕様は現在も活発に更新されています。エラーが出たらまず公式ドキュメントとGitHub Issuesを確認するのが解決への近道です。ネットの記事は情報が古い場合があります。

まとめ

MCPサーバーの自作は、AIに「自分だけのツール」を追加できる強力な手段です。最小構成は「SDKインストール → server.jsを書く → 設定ファイルに登録」の3ステップで動かせます。最初はシンプルなツールから始めて、慣れてきたら外部APIや社内ツールとの連携に発展させていきましょう。

・MCPとは：AIと外部ツールをつなぐオープンプロトコル。サーバーを自作して好きなツールを追加できる
・最小構成：SDK インストール → server.js でツールを登録 → stdio で起動
・Claude Codeへの登録：.claude/settings.json の mcpServers に絶対パスで記述
・注意点：仕様は流動的。エラーが出たら最新の公式ドキュメントを確認する

MCPでAIの可能性を広げながら、その土台となるJavaScript・APIの仕組みはWithCodeで体系的に身につけていきましょう。

よくある質問（FAQ）

Q1. MCPとは何ですか？

A. Model Context Protocolの略で、ClaudeなどのAIと外部ツールやデータを標準化した方法で接続する仕組みです。

Q2. MCPサーバーの自作にプログラミングは必要ですか？

A. 必要です。PythonやTypeScriptのSDKを使ってサーバーを実装するのが一般的です。

Q3. MCPは何に使えますか？

A. 社内データベースやAPI、ファイルなどをAIから安全に呼び出す連携に活用できます。

関連記事｜AIツール活用

WithCodeを体験できる初級コース公開中！

初級コース(¥49,800)が完全無料に！

  • 期間：1週間
  • 学習内容：
    ロードマップ/基礎知識/環境構築/HTML/CSS/LP・ポートフォリオ作成
    → 正しい学習方法で「確かな成長」を実感できるカリキュラム。

副業・フリーランスが主流になっている今こそ、自らのスキルで稼げる人材を目指してみませんか？

未経験でも心配することはありません。初級コースを受講される方の大多数はプログラミング未経験です。まずは無料カウンセリングで、悩みや不安をお聞かせください！

公式サイトから無料カウンセリングに申し込む →
AI

この記事を書いた人

田中誠のアバター 田中誠

WithCodeでWeb制作を習得後、フリーランスエンジニアとして活動。HTML/CSS・JavaScript・WordPress案件を中心に年間20件以上の制作実績を持つ。「難しい技術をわかりやすく」をモットーに、初心者〜中級者向けの技術記事を執筆。副業・フリーランス独立を目指す方に向けた情報発信に注力している。

関連記事

  1. ホーム
  2. AI
  3. MCPサーバー自作入門｜Claude Codeと外部ツールをつなぐ実践ガイド

– service –WithGroupの運営サービス

  • WithCode
    - ウィズコード -

    スクール

    「未経験」から
    現場で通用する
    スキルを身に付けよう！

    詳細はこちら

  • WithFree
    - ウィズフリ -

    実案件サポート

    制作会社のサポート下で
    実務経験を積んでいこう！

    詳細はこちら

公式サイト より
今すぐ
無料カウンセリング
を予約！

無料カウンセリングを予約する
目次