MCP Server Hands on

MCP Server Hands on

2025 年 4 月 にソウルドアウト株式会社東京オフィスで開催された社内勉強会の資料です。

背景と目的

近年、生成 AI の進歩は非常に速く、学んだ知識が短期間で陳腐化してしまうことが課題となっています。このような変化の激しい時代において重要なのは、特定の技術や知識そのものではなく、物事を「理解」、「分解」、「論理的に再構築」する考え方やアプローチを身につけることです。

本ハンズオンでは、プログラミングを通じてそのような考え方を獲得するきっかけを提供することを目指しています。プログラミングは、複雑な問題を小さく分解し、解決策を構築するプロセスを体験するのに最適な手段です。このハンズオンを通じて、問題解決のための普遍的なスキルを身につけるきっかけになれば嬉しいです。

今回作成するもの

今回は、有志が開発したポケモンの情報を取得できるオープンソースプロジェクトの PokéAPI を使って、ポケモンの ID（1〜151）を入力し、名前とゲーム内のフレーバーテキストを取得する MCP サーバーを作成します。

Warning

あくまでも有志が作成した API です。必要以上に API を実行したり。権利者の権利を侵害するような用途には使わないようにしてください。

ハンズオンのゴール

1. MCP サーバーの仕組みをなんとなく理解する
2. JavaScript/TypeScript の構文をなんとなく理解
3. コードを書きながらサーバーを動かし、ツールを追加・公開する流れを習得する

進め方

• 全 6 ステップで、小さな成果物を完成させながら進行
• 疑問はチャットや口頭で随時解消

自己学習する際に押さえておくといいかもしれない知識

• JavaScript/TypeScript の基本構文・型システム
• Node.js 環境でのスクリプト実行経験
• コマンドライン（CLI）の基本操作
• HTTP リクエスト（GET/POST）の仕組み

目次

以下の目次は、添付の README.md をもとに作成しました。

1. Step 1: MCP/MCP サーバーとは何か？どんなことができるのか？
   1.1 MCP（Model Context Protocol）
   1.2 MCP サーバー
   1.3 なぜ MCP が必要か？
   1.4 一般的なアーキテクチャ
   1.5 MCP サーバーの活用

2. Step 2: Node.js モジュールの説明とインストール
   2.1 Node.js モジュール・ライブラリとは？
   2.2 package.json の内容解説
   2.3 ハンズオンに必要なモジュールをインストールする

3. Step 3: import 構文の解説
   3.1. 使用するモジュールの解説

4. Step 4: MCP サーバーのツール実装
   4.1 サーバーのインスタンス化
   4.2 ツール（エンドポイント）の定義
   4.3 PokéAPI からデータを取得
   4.4 日本語のフレーバーテキストと名前を抽出
   4.5 レスポンス形式の組み立て
   4.6 サーバー起動
   4.7 ビルドと動作確認

5. Step 5: ツールのメタ情報の定義
   5.1 メタ情報を定義する意味
   5.2 ツール一覧要求（ListTools）用のハンドラを登録
   5.3 定義した情報を確認する

6. Step 6: Claude Desktop から MCP サーバーに接続
   6.1 Claude Desktop の設定を開く
   6.2 開発者向けの構成ファイルを開く
   6.3 MCP サーバーを登録する
   6.4 Claude Desktop で動作確認

補足

• JavaScript/TypeScript
  Web やサーバーで動作するスクリプト言語。TypeScript は JavaScript に型情報を加えた言語。
• Node.js
  JavaScript をサーバー上で実行するランタイム環境。
• CLI（コマンドラインインターフェース）
  文字ベースの操作画面でコマンドを直接入力して操作する環境。
• HTTP リクエスト
  クライアントからサーバーへの要求。主に GET（取得）と POST（送信）がある。