GitHub CopilotでMCPを使いこなす

Transcript

1. GitHub CopilotでMCPを使いこなす GitHub Copilot、VSCodeを中心にAIを使う ラク / @rakutek dely, inc. GitHub Copilot活用術~MCP・レビュー・issue・Coding Agentまで！~
2. 自己紹介 坂口 楽 2023年にdely株式会社へ入社(10月にクラシル株式会社に変更予定) サーバーサイドエンジニアとして「クラシル」 「クラシルリワード」の バックエンド開発を担当した後、現在はSREとして新規事業のサービス 立ち上げ AIツールの導入と管理・活用を推進 X: @rakutek GitHub: @rakutek GitHub Copilot活用術~MCP・レビュー・issue・Coding Agentまで！~
3. GitHub Copilot活用術~MCP・レビュー・issue・Coding Agentまで！~
4. Findy Toolsさんへの寄稿記事 delyでは2023年2月に導入した後、2年半以上継続し て使用 安価でありながら、コーディング支援に留まらない 幅広い機能 チームで使うのに便利な機能 GitHub Models,Copilot Reviewなど 記事URL: https://findy-tools.io/articles/ai-codingtool/88 GitHub Copilot活用術~MCP・レビュー・issue・Coding Agentまで！~
5. VSCodeの優位性 VSCodeとGitHub Copilotが他と比べて優れていると思うのがMCP周りの実装 GitHub Copilot活用術~MCP・レビュー・issue・Coding Agentまで！~
6. 皆さんに質問 皆さんは、MCP (Model Context Protocol) を使っていますか？
7. VSCodeでのMCP設定方法 プロジェクトのルートに .vscode/mcp.json を使う コミットしてチームでMCPの設定を共有可能 ユーザー設定のmcp.jsonを使う 他のMCPクライアントの設定を自動検知・再利用 setting.jsonの chat.mcp.discovery.enabled で有効化 "chat.mcp.discovery.enabled": { "claude-desktop": false, "windsurf": false, "cursor-global": false, "cursor-workspace": false } GitHub Copilot活用術~MCP・レビュー・issue・Coding Agentまで！~
8. VSCodeのmcp.jsonの基本構造(ダミーコード) 主な要素: inputs : APIキーなど、ユーザーに入力を促す設定値のプレースホルダーを定義します servers : 起動するMCPサーバーのリストを定義します "servers": { "MyServer": { "type": "stdio", "command": "npx", "args": ["-y", "@modelcontextprotocol/server-example"], "env": { "API_KEY": "${input:api-key}" } } } { "inputs": [ { "type": "promptString", "id": "api-key", "description": "APIキー", "password": true } ], } GitHub Copilot活用術~MCP・レビュー・issue・Coding Agentまで！~
9. VSCodeのmcp.jsonの基本構造(ダミーコード) 主な要素: inputs : APIキーなど、ユーザーに入力を促す設定値のプレースホルダーを定義します servers : 起動するMCPサーバーのリストを定義します "env": { "API_KEY": "${input:api-key}" } { "inputs": [ { "type": "promptString", "id": "api-key", "description": "APIキー", "password": true } ], "servers": { "MyServer": { "type": "stdio", "command": "npx", "args": ["-y", "@modelcontextprotocol/server-example"], } } } GitHub Copilot活用術~MCP・レビュー・issue・Coding Agentまで！~
10. VSCodeのmcp.jsonの基本構造(ダミーコード) 主な要素: inputs : APIキーなど、ユーザーに入力を促す設定値のプレースホルダーを定義します servers : 起動するMCPサーバーのリストを定義します "inputs": [ { "type": "promptString", "id": "api-key", "description": "APIキー", "password": true } ], { "servers": { "MyServer": { "type": "stdio", "command": "npx", "args": ["-y", "@modelcontextprotocol/server-example"], "env": { "API_KEY": "${input:api-key}" } } } } GitHub Copilot活用術~MCP・レビュー・issue・Coding Agentまで！~
11. VSCodeのmcp.jsonの基本構造(ダミーコード) 主な要素: inputs : APIキーなど、ユーザーに入力を促す設定値のプレースホルダーを定義します servers : 起動するMCPサーバーのリストを定義します "env": { "API_KEY": "${input:api-key}" } { "inputs": [ { "type": "promptString", "id": "api-key", "description": "APIキー", "password": true } ], "servers": { "MyServer": { "type": "stdio", "command": "npx", "args": ["-y", "@modelcontextprotocol/server-example"], } } } GitHub Copilot活用術~MCP・レビュー・issue・Coding Agentまで！~
12. セキュアなMCPのクレデンシャル管理 実行時にユーザーへ入力を要求し、その値はVSCode側に安全に保存 APIキーなどの機密情報のハードコードを防げる mcp.json の inputs セクションで "password": true を設定すると、MCPのクレデンシャルをセキュアに渡 すことが可能 GitHub Copilot活用術~MCP・レビュー・issue・Coding Agentまで！~
13. SRE業務とMCPの実例 ご紹介する内容は、VSCodeとGitHub CopilotでMCPを活用した普遍的なもの🙆‍♂️ 普段SREの業務で使っているMCPの活用方法を紹介します。 GitHub Copilot活用術~MCP・レビュー・issue・Coding Agentまで！~
14. 実例：VSCode中心のインフラアラート調査 アラートが発生した際、開発者がエディター上でインフラのコードや関連ドキュメント、AWS MCPを使って CloudWatchのデータをまとめて調査できる環境づくりを密かに進めています。 delyではIaC (Terraform) と同じリポジトリで、RunbookやPlaybookもMarkdownとしてGit管理しています。 GitHub Copilot活用術~MCP・レビュー・issue・Coding Agentまで！~
15. AWS公式のMCPサーバー URL: https://github.com/awslabs/mcp GitHub Copilot活用術~MCP・レビュー・issue・Coding Agentまで！~
16. awslabs/mcpで利用可能なMCPサーバー(2025年7月時点) GitHub Copilot活用術~MCP・レビュー・issue・Coding Agentまで！~
17. めちゃくちゃ多い
18. 今日はCloudWatch MCPサーバーだけ扱います GitHub Copilot活用術~MCP・レビュー・issue・Coding Agentまで！~
19. CloudWatch MCPサーバーで利用可能なツール一覧 CloudWatch Metrics get_metric_data : 詳細なメトリクスデータを取得 get_metric_metadata : 特定メトリクスのメタデータを取得 get_recommended_metric_alarms : メトリクスに対する推奨アラームを取 得 CloudWatch Alarms ←これ get_active_alarms : 現在作動中のアラームを特定 get_alarm_history : 特定アラームの履歴（状態変化）を取得 CloudWatch Logs describe_log_groups : ロググループのメタデータを検索 analyze_log_group : ロググループから異常やエラーパターンを分析 execute_log_insights_query : Logs Insightsクエリを実行 get_logs_insight_query_results : クエリ結果を取得 cancel_logs_insight_query : 実行中のクエリをキャンセル GitHub Copilot活用術~MCP・レビュー・issue・Coding Agentまで！~
20. .vscode/mcp.json でCloudWatch MCP設定をチームで共有 aws-vault 等を使う環境では、AWS Vaultに設定するプロファイ名がメンバーで異なる場合がある。 →mcp.jsonのinputs 機能でプロファイル名をメンバーごとに動的に入力させる。 GitHub Copilot活用術~MCP・レビュー・issue・Coding Agentまで！~
21. 具体的な設定例 (.vscode/mcp.json) 補足: 🙅‍♂️現状、AWS LabsのMCPサーバーは複数のAWSプロファイルを直接切り替える機能にできます応していま せん。 プロファイル毎にMCPサーバー名を分けて定義して擬似的に複数環境に対応させています { "inputs": [ { "type": "promptString", "id": "service-A-profile", "description": "サービスAのaws-vaultに設定しているプロファイル名", "password": false }, { "type": "promptString", "id": "service-B-profile", "description": "サービスBのaws-vaultに設定しているプロファイル名", "password": false } ], "servers": { "serviceA-cloudwatch": { "command": "aws-vault", "args": [ "exec", "${input:service-A-profile}", "--", " " GitHub Copilot活用術~MCP・レビュー・issue・Coding Agentまで！~
22. 具体的な設定例 (.vscode/mcp.json) 補足: 🙅‍♂️現状、AWS LabsのMCPサーバーは複数のAWSプロファイルを直接切り替える機能にできます応していま せん。 プロファイル毎にMCPサーバー名を分けて定義して擬似的に複数環境に対応させています "description": "サービスAのaws-vaultに設定しているプロファイル名", { "inputs": [ { "type": "promptString", "id": "service-A-profile", "password": false }, { "type": "promptString", "id": "service-B-profile", "description": "サービスBのaws-vaultに設定しているプロファイル名", "password": false } ], "servers": { "serviceA-cloudwatch": { "command": "aws-vault", "args": [ "exec", "${input:service-A-profile}", "--", GitHub Copilot活用術~MCP・レビュー・issue・Coding Agentまで！~
23. 具体的な設定例 (.vscode/mcp.json) 補足: 🙅‍♂️現状、AWS LabsのMCPサーバーは複数のAWSプロファイルを直接切り替える機能にできます応していま せん。 プロファイル毎にMCPサーバー名を分けて定義して擬似的に複数環境に対応させています "description": "サービスBのaws-vaultに設定しているプロファイル名", "inputs": [ { "type": "promptString", "id": "service-A-profile", "description": "サービスAのaws-vaultに設定しているプロファイル名", "password": false }, { "type": "promptString", "id": "service-B-profile", "password": false } ], "servers": { "serviceA-cloudwatch": { "command": "aws-vault", "args": [ "exec", "${input:service-A-profile}", "--", "uvx", "awslabs cloudwatch-mcp-server@latest" GitHub Copilot活用術~MCP・レビュー・issue・Coding Agentまで！~
24. 具体的な設定例 (.vscode/mcp.json) 補足: 🙅‍♂️現状、AWS LabsのMCPサーバーは複数のAWSプロファイルを直接切り替える機能にできます応していま せん。 プロファイル毎にMCPサーバー名を分けて定義して擬似的に複数環境に対応させています "serviceA-cloudwatch": { p "description": "サービスBのaws-vaultに設定しているプロファイル名", "password": false } ], "servers": { "command": "aws-vault", "args": [ "exec", "${input:service-A-profile}", "--", "uvx", "awslabs.cloudwatch-mcp-server@latest" ] }, "service-B-cloudwatch": { "command": "aws-vault", "args": [ "exec", "${input:service-B-profile}", "--", "uvx", "awslabs cloudwatch-mcp-server@latest" GitHub Copilot活用術~MCP・レビュー・issue・Coding Agentまで！~
25. 具体的な設定例 (.vscode/mcp.json) 補足: 🙅‍♂️現状、AWS LabsのMCPサーバーは複数のAWSプロファイルを直接切り替える機能にできます応していま せん。 プロファイル毎にMCPサーバー名を分けて定義して擬似的に複数環境に対応させています "service-B-cloudwatch": { "serviceA-cloudwatch": { "command": "aws-vault", "args": [ "exec", "${input:service-A-profile}", "--", "uvx", "awslabs.cloudwatch-mcp-server@latest" ] }, "command": "aws-vault", "args": [ "exec", "${input:service-B-profile}", "--", "uvx", "awslabs.cloudwatch-mcp-server@latest" ] } } } GitHub Copilot活用術~MCP・レビュー・issue・Coding Agentまで！~
26. .github/prompts/でプロンプトをテンプレート化 check_all_cloudwatch_alerm.prompt.md : 現在アラート状態になっているCloudWatch Alarmを取得したい --- mode: 'agent' tools: ['cancel_logs_insight_query', 'describe_log_groups', 'execute_log_insights_query', 'get_active_alarms', 'get_alarm_history', 'get_logs_insig --- serviceA,serviceBそれぞれのアラート状態のアラームをMCPで取得してください。 - **対象リージョン**：ap-northeast-1 - **取得対象**：アラート状態（`ALARM`）のアラーム - **取得したアラームの除外条件**：アラーム名に「Low」が含まれるものはAutoScalingアラームなので除外 GitHub Copilot活用術~MCP・レビュー・issue・Coding Agentまで！~
27. 保存したプロンプトの実行方法は2つ チャットからスラッシュで実行 コマンドパレットから実行 GitHub Copilot活用術~MCP・レビュー・issue・Coding Agentまで！~
28. 実際にプロンプトを実行してみる 複数のAWSプロファイルを使ってCloudWatchのアラ ートを一括で取得することができた 🎉 GitHub Copilot活用術~MCP・レビュー・issue・Coding Agentまで！~
29. 最後にVSCodeの最新アップデートの話
30. 7/9にMCP対応がGAになりました 🎉 GitHub Copilot活用術~MCP・レビュー・issue・Coding Agentまで！~
31. 【新機能】 拡張機能の表示エリアにMCPサーバーの管理機能が追加されました 🎉 GitHub Copilot活用術~MCP・レビュー・issue・Coding Agentまで！~
32. 地球儀マークをクリックすると GitHub Copilot活用術~MCP・レビュー・issue・Coding Agentまで！~
33. MCPのギャラリーページが登場 VSCodeの公式サイトに人気のMCPサーバーをまとめたギャラリーページが登場しました。 インストールボタンをクリックするだけでMCPの設定がVSCodeに追加される GitHub Copilot活用術~MCP・レビュー・issue・Coding Agentまで！~
34. GitHub Copilot Business & Enterpriseのユーザー向け version 1.102 より、MCPの設定をGitHub Copilotのポリシーで管理できるようになりました。(デフォルトで無効 になっているので⚠️) In addition, organizations can now control the availability of MCP servers with a GitHub Copilot policy. Learn more about Managing policies and features for Copilot in your enterprise in the GitHub Copilot documentation. GitHub Copilot活用術~MCP・レビュー・issue・Coding Agentまで！~
35. まとめ チームでMCP使うならGithub CopilotとVSCodeがおすすめ
36. Thank you!✊