2
3

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

MCP ライフしていますか?
MCP、なんだそれ?ってなっていましたが、色々試して便利を実感しています。
どの言語でも使いやすいMCPを紹介するので、これを機にぜひ試してみてください!
有識者の方は、おすすめの使い方や取り上げていないMCPなどを情報交換できると嬉しいです!

MCP(Model Context Protocol)とは
AIアプリを外部システムと接続するためのオープンソース標準規格。
例:ChatGPT や Claude が、データソース(ファイル・DB) や ツール(検索・計算)、ワークフロー(特定プロンプト) にアクセスできる。
イメージ:AI用のUSB-Cポート。どんなAIでも統一的に外部接続や連携が可能な拡張機能。
https://modelcontextprotocol.io/docs/getting-started/intro

筆者の環境

Laravel 12 + AngularJS + MySQL + Docker
VSCode最新 + GitHubCopilot
GitHubCopilot CLI
Gemini CLI

おすすめ1 : chrome-devtools

Chrome公式から出たブラウザ操作系のMCPです。画面操作のデバッグをさせたりができます。
再現性の高い操作はPlayWrightがおすすめですが、低いものはコンテキストの使用量が少なく、動作が早く、安定しているchrome-devtoolsにさせるのがベストです。
リンク:npm: chrome-devtools-mcp

利用ケース

WebサイトのUIテストを自然言語で指示する。
指示の例:
「ログインフォームにテスト用メールアドレスとパスワードを入力し、ログインボタンをクリックして、ダッシュボードが表示されるか確認して」
このような指示でE2Eテストを自動化し、手動での確認作業を削減できます。

設定例

"chrome-devtools": {
    "type": "stdio"
    "command": "npx",
    "args": [
        "chrome-devtools-mcp@latest"
    ],
}

おすすめ2 : context7

最新ドキュメントを自動的に参照してくれるMCPです。新しいフレームワークや言語を触るときに重宝します。
最新バージョンに対する回答やバージョンによって差分が大きいコンテキストに対しては、
ハルシネーション(錯覚)を起こしやすいのがLLMの欠点ですが、それを見事に補ってくれます。
DeepWikiにも入れることができ、モダンな環境で開発する方には必須レベルのMCPです。
リンク:GitHub: upstash/context7

利用ケース

リリースされたばかりのライブラリ(例:Laravel 12の新機能)についてAIに質問した際に、AIがWeb上の最新公式ドキュメントを参照して、正確な使い方を回答してくれます。これにより、古い情報や誤った情報に基づいたコーディングを防ぎます。

設定例

"upstash/context7": {
    "type": "http",
    "url": "https://mcp.context7.com/mcp",
    "headers": {
        "undefined": "{context7_api_key}"
    },
    "gallery": "https://api.mcp.github.com/v0/servers/dcec7705-b81b-4e0f-8615-8032604be7ad",
    "version": "1.0.0"
}

おすすめ3 : serena

serenaは既存のソースコードをうまくコンテキストにまとめてくれるMCPです。ソースコードを効率的に検索できるよう、うまくキャッシュをしてくれます。 即効性があるというよりは、徐々に効果を実感できるタイプのMCPです。
リンク:GitHub: oraios/serena

利用ケース

大規模なレガシーコードのリファクタリング時にAIに質問する。
質問の例 : 「この関数 getLegacyData() は、プロジェクト内のどこで使われていますか?」 serenaがソースコード全体を解析し、関連するファイルと具体的な使用箇所を一覧で提示してくれます。

設定例

"oraios/serena": {
    "type": "stdio",
    "command": "uvx",
    "args": [
        "--from",
        "git+https://github.com/oraios/serena",
        "serena",
        "start-mcp-server",
        "serena==latest",
        "--context",
        "ide-assistant"
    ],
    "gallery": "https://api.mcp.github.com/v0/servers/0658e342-7ae7-493a-b378-a324363ee322",
    "version": "1.0.0"
}

おすすめ4 : microsoft/markitdown

こちらはマイクロソフト公式のMCPで、エクセルやパワポをマークダウン化してくれるMCPです。
設計書をいちいちマークダウンにする際、変換処理が大変だったりしますが、うまいことエクセルをマークダウンの表形式にできます。
こちらの設計書をもとにコーディングやRVをさせることも可能で、今までとさほど変わらないやり方で要件に沿った実装を可能にします。
他にもPDFや画像なども対応していますが、エクセル上の画像などには対応していないです。
リンク: GitHub: microsoft/markitdown

利用ケース

PMから受け取ったExcel形式のAPI仕様書をAIに読み込ませて依頼する。
プロンプトの例: 「この仕様に基づいたLaravelのコントローラーとルートの雛形を作成して」
markitdownがExcelをAIが解釈可能なMarkdownに変換し、AIがそれを元にコーディングを開始するため、仕様書からのコード生成が非常にスムーズになります。

設定例

"microsoft/markitdown": {
    "type": "stdio",
    "command": "uvx",
    "args": [
        "markitdown-mcp==0.0.1a4"
    ],
    "gallery": "https://api.mcp.github.com/v0/servers/976a2f68-e16c-4e2b-9709-7133487f8c14",
    "version": "1.0.0"
}
2
3
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
2
3

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?