My MCP Server（初心者向け）

MCP（Model Context Protocol）サーバーを自作するための内容です。次の機能を備えています：

• .env ファイルによる独自のAPIキーとURLのモジュール

• ツール例：echo と call_my_api

• MCP Inspector ですぐにテスト可能

• VS Code（GitHub Copilot Chat）ですぐに利用可能

1. 依存関係をインストール

npm install

Related MCP server: mcp-server-demo

2. .env ファイルを作成

.env.example を .env にコピーし、自分のAPIキーとURLを入力してください：

Copy-Item .env.example .env

.env の中身：

MY_API_KEY=api-key-asli-kamu
MY_API_BASE_URL=https://api.contohkamu.com
MCP_SERVER_NAME=my-mcp-server

⚠️ 絶対に .env ファイルをgitにコミットしないでください。このファイルは .gitignore によって自動的に無視されます。

3. プロジェクトをビルド

npm run build

このコマンドは src/ 内のTypeScriptを build/ 内のJavaScriptにコンパイルします。

4. MCP Inspectorでテスト

MCP Inspectorは、他のクライアントを必要とせずにMCPツールを試せるビジュアル（ブラウザ）ツールです。

npm run inspector

これにより npx @modelcontextprotocol/inspector node build/index.js が実行され、ブラウザでInspectorが開きます。ここでは次の操作ができます：

1. Tools タブをクリック

2. ツール echo または call_my_api を選択

3. パラメータを入力し、Run Tool をクリックして結果を確認

5. VS Codeですぐに使う

.vscode/mcp.json ファイルが用意されています。コマンドパレットを開き、MCP: List Servers → my-mcp-server を選択 → Start Server と進みます。このサーバーは envFile 経由で .env を自動的に読み込みます。

プロジェクト構成

├── .env                  # rahasia kamu (tidak di-commit)
├── .env.example          # contoh isi .env
├── .vscode/mcp.json      # konfigurasi MCP untuk VS Code
├── src/
│   ├── config.ts         # loader environment variable
│   ├── apiClient.ts      # modul pemanggilan API eksternal (pakai API key & URL)
│   └── index.ts          # server MCP utama + daftar tool
├── package.json
└── tsconfig.json

新しいツールを追加する

src/index.ts に新しい server.registerTool("nama_tool", { ... }, async (input) => { ... }) ブロックを追加し、npm run build を再実行してください。

トラブルシューティング

• 「Environment variable ... belum diisi」エラー → .env が存在し、内容が入力されていることを確認してください。

• call_my_api ツールが失敗する → MY_API_BASE_URL と MY_API_KEY が正しいか、APIエンドポイントが Authorization: Bearer <key> ヘッダーに対応しているかを確認してください。

• Inspector が開かない → 先に npm run build を実行していることを確認してください。