GitHub Copilotの全体像と活用のヒント AI駆動開発の最初の一歩

Findyさん開催のイベント『GitHub Copilotの全体像と活用のヒント AI駆動開発の最初の一歩』

様々なAIとの開発スタイルで使えるGitHub Copilotの機能を、活用時のポイントともに、デモを交えて解説します！

## イベントページ
https://findy.connpass.com/event/359954/
https://techplay.jp/event/982890

## スライド中のURL
- VS Codeデモ用リポジトリ: https://github.com/74th/event-githubcopilot-findy-on-vscode
- github.comデモ用リポジトリ: https://github.com/74th/event-githubcopilot-findy-on-github
- モデルとプレミアムリクエスト
- https://docs.github.com/en/copilot/get-started/plans-for-github-copilot
- https://docs.github.com/en/copilot/concepts/copilot-billing/understanding-and-managing-requests-in-copilot
- GitHub Copilot ChangeLog: https://github.blog/changelog/label/copilot/
- VS Code Update: https://code.visualstudio.com/updates

Transcript

2. • 所属: GO株式会社 ◦ タクシーアプリ『GO』を運営 • 職種: ◦ データエンジニア・バックエンドアーキテクト ◦ AIアルゴリズムを実サービスに組み込む Atsushi Morimoto (@74th) 2 • 著書: ◦ 『改訂新版 Visual Studio Code実践ガイド』 技術評論社（2024年1月） • VS Code Meetupオーガナイザ • 趣味: 自作キーボード歴6年、電子工作
3. 今日のゴール • AI駆動開発のイメージができる • GitHub Copilotの具体的な活用方法がわかる • GitHub Copilotの有用性や開発現場での効果がイメージできる • GitHub Copilotの導入を検討してみようと思える 3
4. おことわり • まだAI Codingの世界は変容しつつあります ◦ 今日説明した内容も、次のアップデートでは変わっていたり、 また新しい概念が登場する可能性が大きいです • VS Codeを例に説明します ◦ GitHub Copilotは、JetBrains IDEs、Xcode、Vimなど、 複数のエディタに対応していますが、 一部機能はVS Codeのみ対応しているものもあり、使えない場合もあります • 以下は解説しません ◦ 他のAIエディターとの比較 ◦ LLMモデルの比較 ◦ AIエージェントでできることの限界 4
5. アジェンダ 1. GitHub Copilotの概要 2. GitHub Copilotを活用するAI駆動開発の3つのスタイル 3. Level 1 コーディングサポート 4. Level 2 併走エージェント(Vibe Coding) 5. Level 3 自立エージェント(Coding Agent) 6. エディタ上のGitHub Copilotのその他の機能 ◦ ターミナル、レビュー、コミットメッセージ 7. github.com上のGitHub Copilotを使おう 8. GitHub Copilotのアップデートを追う方法 5
6. 1. GitHub Copilotの概要 6
7. GitHub Copilotとは 7 • GitHub社が提供する有償のAIコーディング支援サービス
8. GitHub Copilotの特徴 8 • エディタVS Codeの開発と密接に取り組み エディタの機能と連携 • 人とAIのコーディングの割合によって、様々な使い方ができる • github.com 上でも機能提供 • 複数のLLMモデルをサポート ◦ GPT-4.1、Claude 4 Sonnet、Gemini 2.5 Proなど • 組織のセキュリティガバナンスを効かせる機能が多数
9. GitHub Copilotを使うには • GitHubアカウントが必要、GitHub上で契約 • 無料枠の GitHub Free プラン ◦ 利用可能量、利用可能モデルに制限あり • 契約単位は、個人と、組織（Organization）の2種類 • 組織のセキュリティガバナンスを効かせる機能がある 9
10. GitHub Copilotを使うには • 個人 ◦ 個人のGitHubアカウントで契約 ◦ 2種類のプラン ▪ 金額（2025-07-12現在） • Pro: $10/月 • Pro+: $39/月 ▪ 利用できる回数とモデルに制限がある • 一般に使うモデルは両方とも使える ▪ 「Pro」で試して、上限に達しても、従量課金でも利用可能 （従量課金は、初期状態は無効） ▪ 始める時には「Pro」で良い 10
11. GitHub Copilotを使うには • 組織 ◦ GitHub上でOrganizationのアカウントで契約する ◦ シートを購入し、メンバーにシートを割り付け ◦ 2種類のプラン「Business」「Enterprise」 ▪ 金額（2025-07-12現在） • Business: $19/月 • Enterprise: $39/月 ▪ 利用できる回数とモデルに制限がある • 一般に使うモデルは両方とも使える • 一部「Enterprise」にしか提供していない機能もある ◦ 現状、Organization単位に、 「Business」と「Enterprise」を選択する必要あり ◦ 始める時には「Business」で良い 11
12. 組織の「Business」「Enterprise」専用機能 • 組織のセキュリティガバナンスを効かせる機能がある ◦ 機能単位の有効・無効 ▪ 会社のセキュリティポリシに合うことを確認してから、有効化できる ◦ OSSと一定量以上同一のコードは生成しない ▪ OSSのライセンスの異なるコードが 知らないうちに入り込んでしまうリスクを低減 12
13. 2. GitHub Copilotを活用する AI駆動開発の3つのスタイル 13
14. AI駆動開発の3つのスタイル 14 Coding Coding Coding Level 1 コーディング サポート Level 2 併走エージェント (Vibe Coding) Level 3 独走エージェント (Agentic Coding) ※　人間の関与率、AIの自律率として、Level 1~3を設定しましたが、優劣はありません
15. AI駆動開発の3つのスタイル 15 Coding Coding Coding ※　人間の関与率、AIの自律率として、Level 1~3を設定しましたが、優劣はありません GitHub Copilotでは 全てのスタイルが使える！ Level 1 コーディング サポート Level 2 併走エージェント (Vibe Coding) Level 3 独走エージェント (Agentic Coding)
16. 3. Level 1 コーディングサポート: 人間のコーディングをAIが補助する 16
17. コーディングサポート 17 • Copilotで意識されているところ ◦ コーディングの集中を切らさずに、AIを支援を得られる • 4つの機能に分けて説明 ◦ コード補完 ◦ 質問 Chat Askモード ◦ チャットで指示 Chat Editモード ◦ エラーの説明と解決
18. コード補完 18 • 前後の文脈を読んで、続くコードを予測して補完するモード • 出てきた補完に対して、Tabキーで決定する • カーソルのすぐ後ろ以外も、補完を提案する（Next Edit Suggestion）
19. コード補完　デモ • https://github.com/74th/event-githubcopilot-findy-on-vscode/tree/ main/001-completion 19
20. コード補完のコツ 20 • メソッド名や、コメントを説明的に記述する ◦ その辺りを読んで、考えてくれる • Pythonのメソッドのパラメータに型ヒントを与えるなど、 絞り込むために必要な情報を渡す • 参考にして欲しいファイルを別タブで開いておく ◦ 現在開いているタブを参照にする傾向がある （必ず参照するわけではない）
21. VS Codeで使えるCopilot Chat • チャットウィンドウ ◦ 右側のペインを呼び出す ◦ モードが Ask / Edit / Agent に別れている ◦ 利用するLLMモデルを選択する • インラインチャット ◦ Ctrl+I/Cmd+Iを押すと、コード中に チャットウィンドウができる 21
22. 質問 Chat Askモード デモ 22 • Chatウィンドウの解説からやる • https://github.com/74th/event-githubcopilot-findy-on-vscode/tree/ main/002-chat_ask
23. 質問の例 • プログラミング言語に関する質問 ◦ (Pythonの) TypedDictってどういう機能？ ◦ (TypeScriptのフロントエンドの実装にて） React.FCってどうやって利用するの？ • エラーに関する質問 ◦ (エラーメッセージを貼り付けて) このエラーを説明して • ワークスペース内のコードの質問 ◦ コードの内容を読み取って、考えてくれる ◦ (コードを開きながら) OperationInteractorってどういう役割のクラスだと思う？ 23
24. 参照して欲しいファイルがあるとき • タブや、ファイルツリーのファイルをドラッグドロップできる • エディタ上で、コードを選択していると、それを参照できる • 画像ファイルも見られるので、スクリーンショットも渡せる 24
25. 実はコードやプログラミングのこと以外も聞ける • ＠xxx と付けると、特殊な質問モードに移行する • 例 ◦ @workspace : リポジトリの内容を調べさせる ▪ @workspace このリポジトリはどのような技術スタックが使われている？ ◦ @vscode : VS Codeの使い方を質問 ▪ @vscode MCPのプログラムがあるけれど、これを使うように追加するに はどうすれば良い？ ◦ @github: githubリポジトリを参照して質問 ▪ @github Reactの最新のバージョンは？ 25
26. チャットで指示 Chat Editモード • 部分的に、チャットで指示して編集させるモード • 指示したファイルを読んで、編集を考えて適用する • 結果は、良ければ「保持/Keep」、 悪ければ追加の指示や「元に戻す/Undo」できる 26
27. 指示の例 • 面倒なことはCopilotにやらせよう ◦ (JSONの生データをエディタに貼り付けて) このJSONを格納するGoの構造体を作って。名前はUserLogだよ。 ◦ (Pythonのクラスのコードを貼り付けて) Goの構造体に書き換えて ◦ (Markdown中の画像のタグをさして) imgタグにして横幅を50%にして 27
28. チャットで指示 Chat Editモード　デモ • https://github.com/74th/event-githubcopilot-findy-on-vscode/tree/ main/003-edit 28
29. エラーの説明と解決 • VS Codeではリンターで検出したエラーには下線が引かれる • エラーからQuick Fix(💡マーク)を呼び出すと、 「Copilot: Explain（説明して）」「Copilot: Fix（修正して）」を 選ぶことができる • その場で、エラーを修正させられる 29
30. エラーの説明と解決　デモ • https://github.com/74th/event-githubcopilot-findy-on-vscode/tree/ main/004-error_resolve 30
31. モデルとプレミアムリクエスト • GitHub Copilotでは複数のLLMモデルが選択できる • ベースモデル以外を利用すると プレミアムリクエストとしてクレジットが消費される • 例 ◦ 無料: (Chat)GPT-4o/4.1 (※Freeの場合x1) ◦ x1: Claude Sonnet 3.7/4、Gemini 2.5 Pro、(ChatGPT-)o3 ◦ x10: Claude Opus 4 31 https://docs.github.com/en/copilot/get-started/plans-for-github-copilot https://docs.github.com/en/copilot/concepts/copilot-billing/understanding-and-managing-requests-in-copilot
32. 4. Level 2 併走エージェント AIに適宜指示する 32
33. AI駆動開発の3つのスタイル（おさらい） 33 Coding Coding Coding Level 1 コーディング サポート Level 2 併走エージェント (Vibe Coding) Level 3 独走エージェント (Agentic Coding) ※　人間の関与率、AIの自律率として、Level 1~3を設定しましたが、優劣はありません
34. Vibe CodingとAgentic Coding（諸説あり） • Vibe Coding ◦ vibe = 感じ、雰囲気 ◦ よく使われる意味 ▪ AIに、やって欲しいことを抽象的に指示して、 技術的な課題をAIが解決し、コーディングさせる ◦ 人間が細かい指示とチェックを行い、完成に近づける • Agentic Coding ◦ よく使われる意味 ▪ AIに、目的を指示して、 目的に向かって自律的に考えてコーディングさせる ▪ AIがタスク分解して、1つずつタスクをこなす ◦ 目的がはっきりしていたり、投機的に独走させ、完成させる • 相反する概念ではないが、今どちらをやっているか意識するとよい 34 Coding Coding
35. Copilot Chat Agentモード 35 • Editモード以上に様々な能力を持つ ◦ ワークスペース全体のコードを検索する ◦ MCP Serverを使って、エディタ外部のリソースと連携する ◦ ターミナル上でコマンドを実行して、 そのコマンドの結果を参照して、動ける ◦ 人間がVS Codeでできることはほとんどができる （まだデバッガによるステップ実行ができない）
36. Copilot Chat Agentモード • 作業のスコープの違い ◦ Editモード: 今開いている、指示したファイル ◦ Agentモード: ワークスペース全体 ◦ Agentモードであっても「今開いているファイルは何か？」という コンテキスト情報は渡される。 • Editモードと意識的に使い分ける必要はなく、 常にAgentモードでも良い 36
37. MCP Server • MCP(Model Context Protocol)とは ◦ LLMから、外部のツールやデータソースと連携するためのプロトコル ◦ GitHub Copilot Chat/Agent: MCP Client ◦ ツール: MCP Server • 様々なツールがMCP Serverとして提供され、 GitHub Copilotから利用可能になっている。 • 例 ◦ GitHubのIssueやPullRequestの操作ができるMCP Server ◦ Webブラウザを起動して操作できる「Playwright MCP」 ◦ AWSのリソースの参照やデプロイ操作ができるAWS公式MCP Server 37
38. MCP Serverの利用設定 • VS Code拡張機能としてインストール • MCP Serverの情報を設定ファイルに記述 ◦ ユーザ設定 ”mcp” ◦ ワークスペース設定 .vscode/mcp.json • 秘匿情報を管理するときにはinputsを使う • Claude Desktop等の設定も認識する機能がある 38
39. Agentモード デモ • https://github.com/74th/event-githubcopilot-findy-on-vscode/tree/ main/005-agent_with_mcp 39
40. Agentが作業できるか？ • 現状のAIエージェントは、 ワークスペース全体のコードが頭に入った状態ではない ◦ あくまで、ファイルツリーなど今ある情報から それっぽいファイルを推測し、「1ファイルずつ開いて読む」を行う ◦ この辺りは、人間と同じようなファイルの読み方をしている ◦ コードのどこかにヒントがあっても見つけられないことがある • 見つけられる、作業できる状態にする 40
41. Agentへの指示方法 • エージェントへの指示には、複数の方法がある 1. 1回限りのプロンプト（Chat欄） 2. 共通ルール（インストラクションファイル） 3. 再利用可能プロンプト（プロントプトファイル） 41
42. Agentへの指示方法の使い分け • 共通ルール（インストラクションファイル） ◦ コーディングルール、コードレビュールール ◦ ワークスペースのファイル構成 ◦ DBなど、外部環境の情報 ◦ ドメイン知識 • 再利用可能プロンプト（プロンプトファイル） ◦ 「テストの生成」の指示と、テストの構成の情報 ◦ 「テストの実行」の指示と、テストの実行コマンド ◦ 情報の多い長いプロンプト • インストラクションファイル、プロンプトファイルは 「Ask」「Edit」モードでも利用可能 42
43. 共通ルール（インストラクションファイル） • 3つの設定方法がある • .github/copilot-instructions.md ◦ ワークスペース内で常に参照する ◦ リポジトリにコミットして、共有できる • .github/instructions/xxx.instructions.md ◦ ファイルパターンを指定して、そのファイルの参照時のみ、参照する ◦ リポジトリにコミットして、共有できる • ユーザ設定内 prompts/xxx.instructions.md ◦ ファイルパターンを指定して、そのファイルの参照時のみ、参照する ◦ ユーザ設定として、ワークスペースをまたいで利用できる 43
44. 共通ルール（インストラクションファイル） 44 適用するファイルを指定
45. 共通ルール（インストラクションファイル）の生成 • 現在のコードを解析し、 インストラクションファイルを生成させることができます • 生成されたファイルをベースに変更を加えるのも良いでしょう 45
46. 再利用可能プロンプト（プロントプトファイル） • 作ると、チャット欄で/xxxの形で呼び出せる • LLMモデル、MCP Serverを指定できる • .github/prompts/xxx.prompts.md ◦ リポジトリにコミットして、共有できる • ユーザ設定内 prompts/xxx.instructions.md ◦ ファイルパターンを指定して、そのファイルの参照時のみ、参照する ◦ ユーザ設定として、ワークスペースをまたいで利用できる 46
47. Agentへの指示方法　デモ • https://github.com/74th/event-githubcopilot-findy-on-vscode/tree/ main/006-agent_with_instruction 47
48. 74thのテクニック • インストラクションファイルは分割する ◦ 一度に多くの情報は読めないことを意識する ◦ 「DB定義については ./db.md を参照」と書いておいて、 必要時に参照させる ◦ DB定義全部は多いプロジェクトもあったりする。 ファイル分割はドメインの概念毎にする。 48 それぞれ必要時に以下を参照 - タクシーの予約 ./reservation.md - ユーザのキャンセル ./cancel.md 例
49. 74thのテクニック • 2行以上の指示は常にプロンプトファイルに書く ◦ .github/prompts/do.md をテンポラリのファイルにして 毎回 /do と指示する ◦ 細かく指示するのも手だが、まとめた指示の方が、再トライしやすい • プロンプトではファイル名やクラス名を指定する ◦ 今実装に使って欲しいクラス名やファイル名を指示する ◦ そうしないと、ディレクトリ構造の探索からスタートする ◦ クラス名があれば、全文検索をかけて、探せる 49 タスクの管理に、楽観排他制御を導入したい todo_api/domain/entity/entity.py のTaskに楽観排他制御用の項目を追加して todo_api/memdb/memdb.py のMemDBがデータ管理レイヤーだから、 排他制御のチェックや楽観排他の値はMemDB内で実行して 例
50. 74thのテクニック • ライブラリを使うことを指示する ◦ 優秀なため、ライブラリを使わずに全部実装しようとしがち ◦ 「カレンダー入力にはライブラリを使って」など ライブラリを使って欲しい部分を指示しよう 50
51. その他の機能 • MCP Server ツールセット ◦ 一度に使うMCP Serverのセットを作っておけます ◦ 権限を与えすぎないように、 特定のタスクができるセットを作っておくと良いでしょう • Chatモード ◦ Ask / Edit / Agent の選択欄に、Agentのモードを追加できます ◦ 書き込み系Toolを制限して、プランニング専用のモードや、 特定のMCP Toolのみを許可して、AWS操作専用モードなどを作り込めます。 51
52. Agentモードのセキュリティリスク • ターミナルでコマンドを実行するため、 ワークスペース外のファイルにアクセスしたり、 破壊する可能性がある • ワークスペース外の秘匿情報や、本番環境のクレデンシャルを入手し、 AIが勘違いして送信してしまう可能性がある • 悪意のあるMCP Serverがあれば、 Copilotにそのような指示をして行わせる可能性がある 52
53. Agentモードのセキュリティリスク • GitHub Copilotで取られている対策 ◦ ターミナルのコマンド実行の度にユーザに確認する ◦ 1回のプロンプト実行の度に 使用可能にするMCP Server Toolを制限できる。 VS Codeの機能も制限できる。 ▪ 外部リソースを使うMCP Serverは必要時以外は有効にしない。 ▪ 特定のMCP Server Toolを使うときには、 コード読み取り、編集機能は有効にしない。 • ユーザが取れる対策 ◦ 不用意にMCP Serverを利用しない ◦ DevContainerなど、サンドボックス環境を構築し、 そこからAgentモードを利用する 53
54. 5. Level 3 独走エージェント AIに目標を達成まで独走させる 54
55. AI駆動開発の3つのスタイル（おさらい） 55 Coding Coding Coding Level 1 コーディング サポート Level 2 併走エージェント (Vibe Coding) Level 3 独走エージェント (Agentic Coding) ※　人間の関与率、AIの自律率として、Level 1~3を設定しましたが、優劣はありません
56. GitHub Copilot coding agent • GitHubのIssueに @copilot をアサインすると、 クラウド上でGitHub Copilotが起動し、 Issueの内容に従ってコーディング、PullRequestの作成まで行う機能 • Issue上でAgentとやりとりできるが、 基本的には一気にIssueの解決まで作業し、その間には指示はできない • Freeでの利用は不可 注: 💻Agentモード、☁coding agentのどちらも、 Vibe coding、Agentic Codingの両方の考えで使えます。 思想に近い機能としてそれぞれ解説しています。 56
57. 💻Agentモードと☁coding agentの比較 • 人間に確認する頻度 ◦ 💻Agentモード: なるべく人間に指示を仰ぐように見える ◦ ☁coding agent: Issueの完遂まで動くように見える • MCP Server設定 ◦ 💻Agentモード: .vscode/mcp.json ◦ ☁coding agent: GitHubリポジトリの設定。.vscode/mcp.jsonも参照。 • インストラクションファイル ◦ 💻Agentモード、☁coding agentも同じ（前述参照） 57
58. ☁coding agent デモ • https://github.com/74th/event-githubcopilot-findy-on-github 58
59. プレミアムリクエスト • ☁coding agentを利用した場合、 1セッションにつき、1プレミアムリクエストを消費する • プレミアムリクエストは個人に紐付いているため、 起動したきっかけになったユーザのプレミアムリクエストを消費する ◦ Issueに @copilot をアサインした人 ◦ @copilot がアサインされた Issue に返信した人 ◦ この部分の確認が不正確であるため、違ったらごめんなさい 59
60. 6. エディタ上のその他の機能 60
61. コードレビュー • コミット前に、gitにステージングしたコードをレビューをしてくれる機能 • タイポや、一般的なセキュリティリスクのある書き方は指摘してくれる 61
62. コミットコメント • コミットコメントを、gitの変更内容から、書いてくれる機能 • 設定で、プロンプトを渡すこともでき、 `feat: xxx` と書くように決まっている場合や、 確実に日本語で書いて欲しい場合に設定すると良い。 62
63. ターミナル • ターミナルのコマンドを、プロンプトから生成させる機能 • ターミナルにて、Ctrl+I、Cmd+Iで呼び出す • よく忘れるコマンドの引数などを生成してもらうと良い • 例 ◦ サブディレクトリに渡って、node_modules/ディレクトリを検索して、削除す るコマンドを作って 63
64. JupyterNotebookの編集 • セルを記述し、実行できます 64
65. JupyterNotebookの編集 • グラフ化した内容もVisionで読み取り、特徴を言葉で示します 65
66. 7. github.com上のGitHub Copilotを使おう 66
67. 質問 • GitHubリポジトリに対して質問で きる ◦ このリポジトリの技術スタックを 教えて • IssueやPull Requestを参照して質 問できる • Pull Requestのコードについて、 これはどういう修正か質問するこ とができる 67
68. コードレビュー • Pull Requestに @copilot をアサインすると、レビューしてくれる機能 • 自動で、@copilotをアサインするようにもできる • タイポや、一般的なセキュリティリスクのある書き方は指摘してくれる • タイポなど、人間の目で確認するまでもない指摘は、Copilotにやらせよう 先にレビューさせよう！ 68
69. その他 • GitHub Copilot Spaces ◦ リポジトリをまたいで情報を集約して、質問できる機能 ◦ 現状、参照可能な範囲が狭く、まだ使いこなすのは難しい印象 ◦ https://docs.github.com/ja/copilot/how-tos/provide-context/use-copilot -spaces/create-and-use-copilot-spaces • GitHub Spark ◦ AIに指示して、Webアプリのプロトタイプが作れるサービス ◦ https://github.com/features/spark?locale=ja 69
70. 8. GitHub Copilotのアップデートを追う方法 70
71. GitHub Copilot ChageLog • https://github.blog/changelo g/label/copilot/ • VS Code以外のエディタの更 新や、 github.com の更新も追うこと ができる • 新しいLLMモデルの追加は、 こちらで告知される • Xアカウントでも告知される 71
72. VS Code Update • https://code.visualstudio.com/up dates • GitHub Copilotのエディタの最新機 能は、まずVS Codeに実装されてい る • VS Codeは毎月定期の 最近更新の6-7割が GitHub Copilot関連。 VS Codeのアップデートを追うと、 GitHub Copilotの機能が追える • なにより、ちゃんとドキュメント化 されているので、追いやすい 72
73. VS Code Meetup • 2019年から続く VS Codeの日本コミュニティ • 最近のVS Codeのアップデートの 7割がGitHub Copilot関連 • 毎月VS Codeのアップデートを追う イベントを開催 • 74thがオーガナイザをしています！ 73
74. GitHub Copilotの勉強会は国内でも盛んに行われている • GitHub dockyard ◦ GitHubに関する知見の共有や、質問・サポート、雑談を行えるコミュニティ • AIエージェントユーザー会（AIAU） ◦ GitHub Copilot Meetup Tokyoを開催 • 他にも多数開催されています！ 74
75. さいごに 75
76. さいごに 76 • AI Codingの世界は、まだまだ変わりつつあります ◦ ツールのトレンドも、週単位で変わり続けています ◦ 期待して使おうとしても、 まだまだ期待したとおり動いてくれないことも多いです • 所属会社（GO）では、Cursor、Claude Code、Geminiも活用中！ • 実際に使ってみて、 「今どのくらい使えるのか？　どう準備したら期待通りになるのか」の 肌感を知っておくと、今後のAIの発展に地続きで参加できます • 私自身も仕事のコーディングではAIに任せている割合は まだ高くはありません。 • AIに任せられる範囲を増やして、開発生産性を上げていきましょう！