🌟
MCP Apps の動作確認をローカルで確認できる sunpeak を使ってみた
MCP Apps（Claude Connectors / ChatGPT Apps）を開発していて面倒なのが、動作確認のたびに ngrok などでトンネルを張って、Claude や ChatGPT にホスト URL を登録して……という手順です。
sunpeak を使うと、ローカルで ChatGPT / Claude のレンダリング環境を再現できるので、試してみました。
sunpeak とは
ChatGPT Apps・Claude Connectors などの MCP Apps 開発・テストを一貫して行えるオープンソースフレームワークです。
| 機能 | 概要 |
|---|---|
| App Framework | TypeScript / React ベースの MCP App 開発基盤 |
| Inspector | localhost:3000 で ChatGPT / Claude のレンダリングをローカル再現 |
| Testing Framework | Unit / E2E / Visual / Eval の多層テスト |
MIT ライセンス、Node.js 20 以上が必要です。
使い方
まず MCP Apps のサーバーをローカルで起動しておきます。ここでは http://localhost:3001/mcp で起動している前提です。
あとは以下のコマンドを実行するだけです。
npx sunpeak inspect --server http://localhost:3001/mcp
localhost:3000 で Inspector が起動し、ChatGPT / Claude のレンダリング環境がブラウザで開きます。
左のサイドバーのToolからツールを選択してパラメータをTool Input(JSON)に入力してRunでツールの実行ができます。
画面内のボタンの動作確認もできます。
まとめ
npx sunpeak inspect --server <MCPサーバーのURL> を実行するだけで、動作確認できます。動作確認のたびにトンネルを張り直す手間がなくなるので、開発のテンポが上がります。
同じ悩みを持っている方はぜひ試してみてください。
Discussion