GithubCopilot勉強会

Transcript

1. GitHub Copilot Mastery 補完ツールから⾃律型 「開発パートナー」への進化 完全解剖: モデル選定 (Model Selection) MCP (Model Context Protocol) カスタム命令 (Custom Instructions) Agent ワークフロー (Agent Workflow)
2. The Past: 補完ツールとして Mindset: 「コードを書かせる」 Scope: 単⼀ファイルの⾏補完、関数⽣成、ボイラープレー ト。 The Future: 開発パートナーとして Mindset: 「制御して⾃律稼働させる」 Scope: 設計から実装、テスト、コードレビュー(PR作成)まで のフルサイクル。 Limitation: 開発者が常に⽂脈を補完し、マイクロマネジメ ントする必要がある。 Capability: 「ええ感じにやっといて」という抽象的な指⽰ から、意図を汲み取り⾃律的にタスクを遂⾏。 Copilotの進化: ツールからパートナーへ
3. 抽象的な指⽰ (Prompt) から⾃律的なコード⽣成とPR作成 (Output) に⾄るプロセス。 Key Takeaway: これらすべてを設定することで、初めてCopilotは「⽂脈を理解するAgent」として完成す る。 The Brain (Context) ワークスペース, Git, ターミナル The Engine (Models & Modes) Agent HQ / GPT-5.2 推論と計画の中核を担う、⽤途に応じた最適なモデル の選択と切り替え。 The Hands (Tools) コマンド実⾏, ファイル編集 The Rules (Instructions) .instructions.md The Bridge (MCP) 外部API, Docs連携 The Copilot Ecosystem: Agent アーキテクチャ
4. Agentモードを活⽤することで、単なる対話から「ファイル編集＋コマンド実⾏」の⾃動化へ移⾏する。 モード名 役割 特徴‧スコープ Ask 質問‧理解 ⾃然⾔語でコードの意味やエラー原因を確認 (読み取り専⽤)。 Edit コード編集 既存コードへの具体的な追加‧修正‧削除の指⽰ (単⼀〜複数ファイル)。 Plan 設計‧整理 実装前にタスクを分解し、⼿順と全体像を設計。 Agent ⾃律的な作業実⾏ 抽象的な指⽰からタスクを分解、ファイル編集からターミナル実⾏まで⾃律対応。 AI Agent Expert 拡張‧特化 特定分野に特化したカスタムAgentの作成や設定を⾏う。 The Engine Part 1: Copilotの5つの実⾏モード
5. Agent HQ & Premium Requests Anthropic, OpenAI, Google等のモデルを単⼀のGitHubインターフェースで統合管 理。⾼度なモデル使⽤時はプレミアムリクエストを消費。 GPT-5.2, GPT-5.1-Codex-Max ⾼い推論能⼒で複雑なタスクを処理。 Claude 3.5 Sonnet, GPT-4o, GPT-5.1-Codex 推論能⼒と速度のバランスが取れた主⼒モデル。 Gemini 3 Flash, Claude 3.5 Haiku, GPT-5 mini 圧倒的な応答速度で思考を⽌めない軽量モデル。 The Engine Part 2: モデル選定とAgent HQ
6. Workspace Noise (Code, Logs, Git History) から Prompt Payload を精製する。 コンテキストを絞り込むことで、Agentの推論のブレを防ぎ、ハルシネーションを極限まで減らす。 #codebase ワークスペース全体と依存関係の把握。プロジェクト全体の アーキテクチャやルールを参照させる際に使⽤。 #file:{NAME} 特定のファイルへのフォーカス。対象ファイルを明⽰的に読み 込ませることで、推論の精度を⾼める。 #git 現在のブランチ情報やコミット差分の読み込み。変更意図の抽 出や、PR作成のコンテキストとして活⽤。 #terminalLastCommand 直前の実⾏エラーや出⼒ログの取得。エラー解決のためのデ バッグ情報をAIに正確に引き渡す。 The Brain: ワークスペースの⽂脈(コンテキスト)を注⼊
7. 組み込み機能 (Built-in Tools) 拡張機能 (Extension Tools) runCommands: ターミナルでコマンドを実⾏ runTests: 単体テストを実⾏ edit: ワークスペース内のファイルを編集 search: ワークスペース内のファイルを検索 fetch: URLからWebコンテンツを直接取得 GitHub Pull Requests: VS Codeの拡張機能を「ツール」として解 放。Agentが直接PRの情報を参照‧操作可能になる。チャット参 加者として有効化。 The Hands: 組み込み機能と拡張機能ツール
8. 外部システムを安全かつ共通ルールで利⽤するためのプロトコル。 [MCP Client] Copilot / VS Code [MCP Server] GitHub / MS Learn / Database MCP未導⼊ MCP導⼊後 APIごとに個別実装が必要。 権限やアクセス範囲が曖昧。 Agentが実務を代⾏しにくい。 アクセス範囲とスコープが明確化。 読み取り‧書き込みを標準制御。 複数サービスを同⼀ルールで安全に実⾏。 The Bridge: MCP (Model Context Protocol) の真価
9. 公開MCPの追加 (Marketplace) Microsoft Learn MCP Serverなどを拡張機能から直接インストール。 Use Case: 「Azureへのデプロイ⼿順」を質問すると、Agentが最新の 公式Docsをフェッチして回答 (古い知識を排除)。 ローカルMCPの追加 (JSON Config) Result: Agentがローカル上の指定ディレクトリを⾃由に検索‧参照可 能になる。 MCPの実装: 公開サーバーとローカル連携
10. The Problem VS Code上で付与できるツールは最⼤128個。 全ツールを有効にすると上限に達し、コンテキストが濁り推 論精度が低下する。 The Solution copilot-toolsets.json を作成し、タスク固有の「⼿札」を定義 して瞬時に切り替える。 実装フェーズ(Backend Dev, UI Design等)に合わせてAIの装備を最適化。 The Arsenal: ツールセットによるコンテキスト切り替え
11. 毎回プロンプトで前提を説明する⼿間を省き、Copilotに「空気」を読ませる (Cascading Information Pyramid)。 AGENTS.md (File Tree Root) 最上位ルール: 技術スタックの固定、Copilotの暴⾛防⽌。 instructions.md (File Tree Root) 共通ルール: 実装品質の安定、アーキテクチャ‧命名規則の判断ブレ防⽌。 docs/architecture.md 全体設計ルール: アプリの⽬的‧⾮⽬的、要件誤解の防⽌。 docs/api/README.md ドメイン固有ルール: API固有の契約定義、フロント/バックの連携安定。 The Rules: カスタム命令の階層構造
12. Tech Stack & Constraints UI & Design Architecture & State Verification & Commits Next.js (App Router) + TypeScript Auth: Clerk / DB: Azure Cosmos DB 環境変数は .env.local のみ(コミット禁⽌) Tailwind CSS + shadcn/ui レスポンシブ必須 (スマホ375px〜iPad768px) Server/Client境界の明確化 状態管理は Redux Toolkit (UI状態とキャッシュに限定) <種別>:<要約> 形式の⽇本語コミットメッセージ 変更後は lint, typecheck, build が通る状態を維持 完璧な Instruction の書き⽅ (.instructions.md)
13. 開発者はコードを書くのではなく、Agentの進捗を監視し、進⾏を許可する「ディレクター」となる。 Step 1: Prompt & Plan 要件(⼀覧, CRUD, shadcn/ui)を指⽰。Agentがタスクを分解し計画を⽴てる。 Step 2: Scaffold & Code create-next-app や npm install を許可を求めて実⾏。ファイルを順次⾃律的に⽣成。 Step 3: Run npm run dev で起動。MVP(Minimum Viable Product)が⾃律的に完成。 Step 4: Detect & Iterate エラー発⽣時、#terminalLastCommand を⾃動解析してコードを修正(Auto-fix)。 Execution 1: Agentによる「バイブコーディング」の実践
14. Step 1: 課題の丸投げ (Issue Assignment) Issue(例: "Header / Footer追加")を作成し、@copilot タグを付与。 Copilotが⾃動でコードを編集し、確認⽤のスクリーンショット付きPRを 作成。 Step 2: ⾃律的コードレビュー (AIPR Review) 根本原因の特定: Math.random() がServer/Clientで不⼀致(Hydration Error)を起こしていることを⾃動検知。 乱数⽣成をReducer内に移動する提案コードをインラインで提⽰。 Execution 2: ⾃律的Issue解決とAIコードレビュー
15. The Future of Development: 開発者は「オーケストレーター」へ Models Context & Tools (MCP) Rules
16. https://cdn.dribbble.com/userupload/15895748/file/original-643d690bf971a0d821420a10600acfd5.png?crop=3x99-3076x2404&format=webp&resize=400x300&vertical=center Source: dribbble.com https://smythos.com/wp-content/uploads/2025/05/Screenshot-2025-05-14-at-11.49.50%E2%80%AFAM-1.png Source: smythos.com https://sterfield.co.jp/uploads/09b5edad_a516_4f8f_93d9_5632be519bcc_bdbfc23cfa.jpeg Source: sterfield.co.jp https://raw.githubusercontent.com/ViktorQvarfordt/vscode-pitch-black-theme/master/screenshot.png Source: marketplace.visualstudio.com https://github.blog/wp-content/uploads/2026/01/539474104-b4aa1cae-b24a-452b-b38c-99d82456987f.png Source: github.blog Image Sources