GitHub Copilot無料版の始め方・使い方【2026年版】
生徒GitHub Copilotって無料で使えるって聞いたんですけど、何ができるんですか？有料版と何が違うんでしょう…
ペン博士2024年末から無料プラン（Free）が使えるようになったんだ。まずは無料版で試して、使いこなす感覚をつかんでいこう！
GitHubが提供するAIコーディングアシスタント「GitHub Copilot」は、2024年末から無料プラン（Free）でも使えるようになりました。VS Codeを使っている人なら、コードの補完・チャットによる質問・エージェント機能を追加インストールなしで体験できます。
この記事では、無料版で何ができるのか、どうやって始めるのか、そしてWeb制作学習でどう活用するかを、実際の設定例・コマンド・プロンプト例を交えながら解説します。また、AIコーディングツール7選 本音比較も参考にしてみてください。
目次
GitHub Copilot 無料版（Freeプラン）でできること
無料プランはGitHubアカウントさえあれば今すぐ使えます。月に使える回数・モデルに制限はありますが、コードを書きながら試すには十分な量です。
| 機能 | 内容 |
|---|---|
| コード補完 | 書いている途中の次のコードをグレー文字で提案 |
| インラインチャット | 選択範囲を指定して「この処理を説明して」と質問できる |
| チャットパネル | VS Code 左サイドバーのチャットで自由に質問 |
| エージェント（Agent） | ファイルをまたいで自律的に実装・修正を行う |
| コミットメッセージ生成 | 差分から自動でコミットメッセージを提案 |
利用可能なモデルや月間上限回数は時期によって変わります。最新の情報はGitHubの公式ドキュメントで確認してください。
始め方：GitHubアカウントからVS Code導入まで
セットアップは全部で5ステップです。所要時間は10〜15分程度で完了します。
- GitHubアカウントを作る github.com でサインアップ。すでに持っていればスキップ。
- VS Codeをインストールする code.visualstudio.com から最新版を取得。
- GitHub Copilot拡張を追加する VS Codeの拡張機能パネル（Ctrl+Shift+X）で「GitHub Copilot」を検索してインストール。
- GitHubアカウントでサインインする VS Code左下のアカウントアイコン → 「GitHub でサインイン」を選択。ブラウザでOAuth認証。
- Copilotが有効か確認する VS Codeのステータスバー右下にCopilotアイコンが表示されれば完了。
拡張機能は「GitHub Copilot」と「GitHub Copilot Chat」の2つがセットでインストールされます（2026年時点では1つにまとまっている場合もあります）。
コード補完の使い方
補完機能は何もしなくても自動で動きます。コードを書き始めると数秒でグレー文字の候補が現れます。
- Tab キーで候補を確定
- Esc キーでキャンセル
- Alt+]（Windowsは Alt+]、Mac は Option+]）で次の候補に切り替え
コメントで「やりたいこと」を書いてから本文を書き始めると、文脈を読んで精度の高い候補が出やすくなります。
// ボタンをクリックしたらモーダルを表示する
// 閉じるボタンかオーバーレイをクリックで非表示にする
const modal = document.getElementById('modal');
const openBtn = document.getElementById('open');
// ← ここで Tab を押すとCopilotが続きを提案するコメントを丁寧に書く習慣はコードの可読性も上がるので一石二鳥です。
チャット機能の使い方
VS Codeの左サイドバーにあるチャットパネルからCopilotに質問できます。コードを選択してから聞くと、その箇所に絞った回答を得やすいです。
よく使う質問パターンを紹介します。
# コードを選択して右クリック → 「Copilotで説明する」でも可
# チャットパネルでの質問例
このコードで何をしているか日本語で説明して
このエラーメッセージの原因と修正方法を教えて
TypeError: Cannot read properties of undefined (reading 'style')
このCSSをFlexboxを使ったレイアウトに書き直して
この関数のテストコードをJestで書いてインラインチャットはCtrl+I（Mac: Cmd+I）で呼び出せます。選択したコードの直上に入力欄が現れ、その場で「リファクタして」「バグを直して」と指示できます。
エージェント（Agent）機能の使い方
エージェントはファイルをまたいで自律的にコードを書いたり修正したりする機能です。チャットパネルの入力欄上部で「Agent」モードを選択して使います。
# エージェントへの指示例
index.html にお問い合わせフォームを追加して。
名前・メールアドレス・メッセージの3項目で、
style.css にスマホ対応のスタイルも書いて。エージェントはファイルを実際に編集するため、実行前にどんな変更をするか確認ダイアログが出ます。必ず差分を確認してから適用しましょう。大きな変更をかける前にはGitでコミットしておくと安心です。
GitHub Copilotのカスタム指示を設定すると、エージェントへの指示をプロジェクトごとに最適化できます。
VS Codeのカスタム指示設定
プロジェクトのルートに `.github/copilot-instructions.md` を置くと、Copilotの回答スタイルや前提知識をファイルで指定できます。
# Copilot Instructions
## 言語
- 回答は日本語で
## コードスタイル
- HTML/CSS/JavaScript を使うプロジェクトです
- インデントはスペース2つ
- CSSはBEMライクな命名にする
- コメントは日本語で書く
## 制約
- jQueryは使わない。バニラJavaScriptで書く
- CSSフレームワークは使わないこのファイルをGitで管理すれば、チームメンバー全員が同じ設定でCopilotを使えます。ファイルの書き方や対応バージョンは最新の公式ドキュメントで確認してください。
無料版と有料版の違い
Copilotには無料版（Free）・個人向け有料版（Pro）・法人向け（Business/Enterprise）があります。
| 項目 | Free（無料） | Pro（有料） |
|---|---|---|
| 月額料金 | 0円 | 約10ドル（為替で変動） |
| 補完回数 | 月2,000回まで（目安） | 無制限 |
| チャット回数 | 月50回まで（目安） | 無制限 |
| エージェント | 利用可（回数制限内） | 無制限 |
| 使えるモデル | 選択肢が限られる | GPT-4o・Claude等を選択可 |
| こんな人向け | 学習中・試したい人 | 毎日仕事で使う人 |
回数制限に引っかかったら「今月あと何回使えるか」がステータスバーに表示されます。学習中は無料版で十分なことが多いので、まず30日使ってみて必要なら有料を検討するのがおすすめです。プラン内容・回数は変わる場合があるので最新は公式で確認してください。
Web制作学習での活用ポイントと注意点
CopilotをWeb制作の学習で使うとき、効果的な場面と注意が必要な場面があります。
| 活用シーン | おすすめ度 | 一言メモ |
|---|---|---|
| エラーメッセージの原因調査 | ◎ | コードを貼り付けて聞くと即解説 |
| 知らない書き方の調査 | ◎ | 「このCSSの意味は？」と聞く |
| 繰り返しコードの補完 | ○ | テンプレ・ボイラープレートを素早く |
| ゼロから自分でコードを書く練習 | △ | 補完に頼りすぎると力がつかない |
| 基礎文法の暗記 | × | まずは自分の手で書いて覚える |
「Copilotに聞く前に5分は自分で考える」ルールを決めると、ツールを使いながらも実力がついていきます。提案されたコードは必ず内容を理解してから使うことが大切です。
まとめ
GitHub Copilotの無料版は、GitHubアカウントとVS Codeがあれば今すぐ始められます。補完・チャット・エージェントの3つを組み合わせて使うと、学習のスピードが上がります。ただし、AIが書いたコードを理解せずに使い続けると基礎力が身につかないので、「なぜそう書くのか」を必ず確認する習慣をつけましょう。
・セットアップ：GitHubアカウント → VS Code → Copilot拡張 → サインイン の4ステップ
・補完：コメントで「やりたいこと」を書いてからコーディングすると精度が上がる
・チャット：コードを選択してから質問するとピンポイントな回答を得やすい
・注意点：提案されたコードは内容を理解してから使う。基礎は自分の手で書いて身につける
Copilotで効率を上げながら、HTMLやCSSの土台となる知識はWithCodeで体系的に身につけていきましょう。
よくある質問（FAQ）
Q1. GitHub Copilotは本当に無料ですか？
A. 月ごとの補完・チャット回数に上限のある無料プランがあります。学生やOSSメンテナは条件を満たすと無料で使えます。
Q2. 無料版の制限は何ですか？
A. コード補完数とチャット数に月間の上限があります。上限超過や高度な機能は有料のPro版が必要です。
Q3. VS Codeで使えますか？
A. はい。拡張機能で利用でき、JetBrains系IDEなど他のエディタにも対応しています。
関連記事｜AIツール活用
- Windsurf使い方ガイド｜Cursor代替のAIエディタを実務検証【2026年版】
- Claude Codeでコーポレートサイトを作らせる実践手順｜プロンプト全公開
- MCPサーバー自作入門｜Claude Codeと外部ツールをつなぐ実践ガイド
- AI時代のプログラミング学習ロードマップ【2026年版】｜何をどの順で学ぶか
WithCodeを体験できる初級コース公開中！
初級コース(¥49,800)が完全無料に！
- 期間：1週間
- 学習内容：
ロードマップ/基礎知識/環境構築/HTML/CSS/LP・ポートフォリオ作成
→ 正しい学習方法で「確かな成長」を実感できるカリキュラム。
副業・フリーランスが主流になっている今こそ、自らのスキルで稼げる人材を目指してみませんか？
未経験でも心配することはありません。初級コースを受講される方の大多数はプログラミング未経験です。まずは無料カウンセリングで、悩みや不安をお聞かせください！
