GitHub Copilot は VS Code での開発体験を劇的に変えるツールであり、 シナジーマーケティングでも導入し、全エンジニアが活用しています。 その真の可能性を引き出すには、基本機能の習熟から高度なカスタマイズまで幅広い知識が求められます。
このシリーズでは、GitHub Copilot を段階的に学びたい開発者のために、2 つの記事に分けて解説します。 本記事（基本編） では、Copilot を使いこなすための必須の基本機能をチートシート形式で徹底解説します。そして、続く VS Code の GitHub Copilot をカスタム指示と MCP で高度に使いこなす（応用編）では、カスタム指示や MCP サーバーを用いたさらに一歩進んだ開発テクニックを紹介します。
まずはこの基本編で、Copilot の使い方をしっかりマスターし、日々の開発を加速させましょう。
1. GitHub Copilot の基本機能の使い方
1.1 コード補完の基本操作
インライン提案の受け入れ
Copilot は入力に応じて自動的にコード補完を提案します。
| キー | アクション |
|---|---|
| Tab | 提案全体を受け入れる |
| Ctrl/Command(⌘) + → | 単語単位で受け入れる |
| Esc | 提案を拒否 |
筆者の経験上、コード補完で提案されるコードは途中までは良いものの、完全に意図通りではないケースが多いため、Ctrl/Cmd + →ショートカットを頻繁に活用しています。
// コメントを書いたり、コードを書き始めると、適切なコードが自動提案される // ユーザーの年齢を検証する関数 function validateAge(age: number): boolean { // Copilot が自動的に以下のコードを提案 if (age < 0 || age > 120) { return false; } return true; }
複数提案の切り替え方法
1 つの入力に対して複数の実装オプションを確認できます。
| キー | アクション |
|---|---|
| Alt/Option(⌥) + ] | 次の提案へ |
| Alt/Option(⌥) + [ | 前の提案へ |
| Ctrl/Control(⌃) + Enter | すべての提案をサイドパネルで確認 |
以下は`Ctrl/Control(⌃) + Enter ですべての提案を表示した例となります。
1.2 Copilot Chat 関連のショートカット
コードを書いている際、AI に質問したいことが生じることがあります。そのような場合、Copilot Chat パネルを表示するための便利なショートカットをご紹介します。
| キー | アクション |
|---|---|
| Ctrl + Alt/Control(⌃) + Command(⌘) + I | チャットパネルを開く |
| Ctrl/Control(⌃) + I | エディタ内インラインチャット |
Ctrl/Control(⌃) + Iでエディタ内インラインチャットを開いたイメージ。
1.3 Copilot Chat の活用
チャットモードについて
Copilot のチャットモードでは、Ask,Edit, Agentの 3 つのモードが用意されています。ニーズに応じて選択できます。
| モード | 説明 |
|---|---|
| Ask | コードベースや技術的概念について質問するモード。コード提案を含む回答が得られるが、変更は自動適用されない。 |
| Edit | チャットプロンプトに基づいてコードベース全体で編集を直接適用するモード |
| Agent | 自律的にコーディングワークフローを行うモード。コンテキストやファイルを自動判断し、タスク完了に必要な作業を実行。 |
スラッシュコマンド
| コマンド | 概要 | 詳細 |
|---|---|---|
/explain |
コードの説明 | 選択したコードの動作を説明 |
/fix |
エラー修正 | コンパイルエラーや実行時エラーの修正提案 |
/tests |
テスト生成 | ユニットテストやインテグレーションテストの生成 |
/clear |
チャットのクリア | 新しいチャットセッションを開始します |
/help |
ヘルプ | GitHub Copilot の使い方のクイックリファレンスを表示します |
/doc |
ドキュメント生成 | JSDoc や関数説明コメントの生成 |
/optimize |
パフォーマンス最適化 | コードの効率化や計算量改善 |
/fixTestFailure |
テストの修正 | 失敗したテストを見つけて修正します |
/new |
新規作成 | 新規プロジェクトを作成します |
スラッシュコマンドは、基本的にすべてのチャットモードで使用できますが、一部のコマンドについては、モードによって動作が異なる場合があります。
またコマンドの完全なリストを確認するには、チャットプロンプトボックスに / を入力すれば、現在のモードで利用可能なコマンドが表示されます。
以下は、スラッシュコマンドの使用例です。/helpを使ってクイックリファレンスを表示しています。
@から始まるコマンド(チャット参加者)の一覧
特定のコンテキストに焦点を当てて質問や操作を行うために、@から始まるコマンド（チャット参加者）を使用できます。
これらのコマンドを利用することで、 より的確なサポートを Copilot から引き出すことが可能です。
以下に、主要な @ コマンドとスラッシュコマンドとの組み合わせについて説明します。
| コマンド | 説明 |
|---|---|
@workspace |
ワークスペース内のコードに関する質問や、それに対する操作を行います。現在のプロジェクトのコンテキストを理解した上で、的確な回答や提案を得ることができます。 |
@vscode |
VS Code エディタ自体の機能や設定、拡張機能に関する質問や操作を行います。エディタのカスタマイズや API についての情報を効率的に取得できます。 |
@terminal |
ターミナルでのコマンド実行や、その出力結果の解釈に関する質問ができます。特定のコマンドラインツールの使い方や、エラーの解決策などを相談する際に便利です。 |
@github |
GitHub のリポジトリ、Issue、プルリクエストなどに関する質問や操作を行います。例えば、特定の Issue の情報を検索したり、プルリクエストの概要を把握したりするのに役立ちます。 |
@からはじまるコマンドは、スラッシュコマンドと組み合わせて使うことができます。例えば@workspace /fixのように使用できます。
以下は、チャット参加者使用例です。@workspace /explainを使って、ワークスペースのコードに関しての説明を出力しています。
#から始まるコマンド (チャット変数) の一覧
GitHub Copilot Chat では、前述の @ コマンド（チャット参加者）に加えて、# から始まるコマンド（チャット変数）を利用することで、より具体的な情報やコンテキストを Copilot に提供できます。
これにより、Copilot はユーザーの意図を正確に把握し、より精度の高い回答やコード生成、操作の提案を行うことが可能になります。
| コマンド | 説明 |
|---|---|
#changes |
ソース管理で追跡されているファイルに加えられた変更点（差分）のリストをコンテキストに追加します。 |
#codebase |
現在のワークスペース全体から関連性の高いコードやファイルを解析し、プロンプトのコンテキストとして追加します。 |
#extensions |
VS Code にインストールされている拡張機能や、マーケットプレイス上の拡張機能について質問したり、特定の拡張機能の情報を検索したりする際に使用します。例：「Python #extensions のおすすめは？」 |
#fetch |
指定された URL から Web ページのコンテンツを取得し、その内容をコンテキストに追加します。ドキュメントを参照しながら質問する際などに便利です。 |
#<ファイル名またはフォルダ名> |
# に続けてファイル名やフォルダ名（例: #src/main.js）を入力すると、そのファイルやフォルダの内容をチャットのコンテキストとして明示的に追加します。 |
#githubRepo |
指定した GitHub リポジトリに対してコード検索を実行し、関連情報を収集してプロンプトのコンテキストに追加します。例：「グローバルスニペットとは何か #githubRepo microsoft/vscode で説明して」 |
#new |
新しい VS Code ワークスペースを対話的に作成するための手順を開始します。 |
#newJupyterNotebook |
新しい Jupyter Notebook (.ipynb) ファイルをワークスペース内に作成します。 |
#openSimpleBrowser |
VS Code 組み込みのシンプルブラウザを開き、指定した URL（主にローカルで開発中の Web アプリケーションなど）をプレビューします。 |
#problems |
ワークスペース内で検出されたエラーや警告（「問題」パネルに表示される内容）をコンテキストとして追加します。これにより、コードの修正やデバッグ作業を効率的に進めることができます。 |
#searchResults |
VS Code の検索ビュー（Ctrl+Shift+F または Cmd+Shift+F）で得られた検索結果をプロンプトのコンテキストとして追加します。特定のパターンに一致する箇所について質問する際に有用です。 |
#selection |
現在アクティブなエディタで選択されているコード範囲をコンテキストとして追加します。選択部分に対する具体的な質問、リファクタリング、ドキュメント生成などに利用できます。 |
#<シンボル名> |
# に続けて関数名、クラス名、変数名などのシンボル名（例: #myFunction）を入力すると、ワークスペース内のファイルから該当するシンボルの定義や参照箇所を検索し、コンテキストとして追加します。 |
#terminalSelection |
VS Code 内のターミナルで現在選択されているテキスト範囲をチャットプロンプトのコンテキストとして追加します。ターミナルの出力について質問する際に便利です。 |
#terminalLastCommand |
ターミナルで最後に実行されたコマンドとその出力（もしあれば）をチャットプロンプトのコンテキストとして追加します。コマンドエラーの解決や、次のコマンドの提案を受けるのに役立ちます。 |
#testFailure |
直近のテスト実行で失敗したテストに関する情報をコンテキストとして追加します。テストコードのデバッグや修正箇所を特定するのに役立ちます。 |
#usages |
指定したシンボルがプロジェクト内のどこでどのように使用されているか（参照箇所、実装箇所、定義箇所など）を包括的に検索し、その結果をコンテキストに追加します。コードの依存関係の理解に貢献します。 |
#VSCodeAPI |
VS Code の拡張機能開発で使用する API ドキュメントや関連情報をプロンプトのコンテキストとして追加します。VS Code 拡張機能の開発に関する質問をする際に特に有効です。 |
筆者がよく使うのは、#codebaseや#<ファイル名またはフォルダ名>です。これらのコマンドを使うと、Copilot にコンテキストを明示的に与えることができます。
それにより、関連するコードについて質問したり、そのファイルに基づいた提案を得たりするのに非常に便利です。
以下は、#extensionsを使って、VS Code で使える Python のおすすめの拡張機能を質問しています。
2. まとめ
今回は、GitHub Copilot の基本的な機能と使い方に焦点を当てて解説しました。コード補完のコツや、Copilot Chat での効率的な質問方法など、日々の開発ですぐに役立つポイントをご理解いただけたかと思います。
これらの基本操作をマスターするだけでも、開発の生産性は大きく向上するでしょう。ぜひ、実際のコーディングで Copilot と対話しながら、その能力を最大限に活用してください。
そして、GitHub Copilot の基本を押さえたら、次はより高度なテクニックに挑戦してみてください。
応用編のVS Code の GitHub Copilot をカスタム指示と MCP で高度に使いこなす（応用編） では、カスタム指示を利用した Copilot の回答精度の高め方や、MCP サーバーによる機能拡張など、さらに一歩進んだ活用法を解説しています。あなたの Copilot 体験を、次のレベルへと引き上げましょう。
参考リンク
暇があったらクライミングしているフロントエンドエンジニアです。
