「VSCodeからGitHubにプッシュできない…」 「毎回パスワード入力を求められて面倒」 「GitHub Copilotを使いたいけど、ログインできない」
そんな悩み、VSCodeのGitHub連携で全部解決できます！
VSCodeとGitHubを正しく連携させれば、コードのプッシュ、プル、クローンがボタン一つでできるようになります。さらに、GitHub Copilotのような強力な機能も使えるように。でも、認証方法が複数あったり、エラーが出たりして、設定に苦戦する人も多いんです。
この記事では、VSCodeでGitHubにログインする方法を、画面付きで確実にできるように完全解説します。これを読めば、15分後にはGitHubと完璧に連携したVSCode環境が手に入りますよ！
VSCodeとGitHub連携でできること
連携のメリット
ログインすることで使える機能：
| 機能 | 説明 | メリット |
|---|---|---|
| リポジトリ操作 | クローン、プッシュ、プル | パスワード入力不要 |
| GitHub Copilot | AIペアプログラミング | コード自動補完 |
| Pull Request | VSCode内でPR作成・レビュー | ブラウザ不要 |
| Issues管理 | Issue確認・作成 | 統合された環境 |
| GitHub Codespaces | クラウド開発環境 | どこでも開発 |
| 同期設定 | 設定をGitHubに保存 | 複数PCで同じ環境 |
3つの認証方法
VSCodeからGitHubへの認証方法は3つ：
- GitHub認証（推奨） – 最も簡単で安全
- Personal Access Token（PAT） – 細かい権限設定可能
- SSH鍵 – 従来の方法、上級者向け
それぞれ解説していきます！
【方法1】GitHub認証でログイン（最も簡単！）
ステップ1：VSCodeでGitHubサインインを開始
- VSCodeを起動
- 左下のアカウントアイコンをクリック
- 人型のアイコン
- または「アカウント」と表示
- 「サインインして設定を同期する」を選択
- 「GitHub」を選択
・GitHub（推奨） ・Microsoft アカウント
ステップ2：ブラウザで認証
- ブラウザが自動的に開く
- GitHubのログイン画面が表示
- GitHubにログイン
Username or email address: [あなたのユーザー名] Password: [パスワード] - VSCodeへのアクセスを許可
Authorize Visual Studio Code [Authorize] ボタンをクリック - 確認コードが表示される
- 自動的にVSCodeに戻る場合が多い
- 戻らない場合は手動でコピー
ステップ3：VSCodeで確認
- VSCodeに戻る
- 「正常にサインインしました」と表示
- アカウント確認
- 左下にGitHubユーザー名が表示
- プロフィール画像も表示される
これで完了！ もうパスワード入力は不要です。
【方法2】Personal Access Token（PAT）を使用
PATが必要な場合
- 会社のセキュリティポリシー
- 細かい権限制御が必要
- 自動化スクリプトで使用
ステップ1：GitHubでPATを作成
- GitHubにログイン
https://github.com - Settings（設定）を開く
- プロフィール画像 → Settings
- Developer settings
- 左メニューの最下部
- Personal access tokens → Tokens (classic)
- 「Generate new token」をクリック
- トークンの設定
Note: VSCode用（メモ） Expiration: 90 days（有効期限） Select scopes:（最低限必要な権限） ☑ repo（フルコントロール） ☑ workflow（Actions用） ☑ user（ユーザー情報） - 「Generate token」をクリック
- トークンをコピー
ghp_xxxxxxxxxxxxxxxxxxxxxxxxxxxxx ※この画面でしか表示されない！必ずコピー
ステップ2：VSCodeで設定
- ターミナルを開く
表示 → ターミナル または Ctrl + ` - Gitの設定
git config --global user.name "あなたのGitHubユーザー名" git config --global user.email "your-email@example.com" - 初回プッシュ時にトークンを使用
Username: あなたのGitHubユーザー名 Password: [PATを貼り付け]（パスワードではない！）
【方法3】SSH鍵での認証（上級者向け）
ステップ1：SSH鍵の生成
ターミナルで実行：
# 鍵の生成
ssh-keygen -t ed25519 -C "your-email@example.com"
# Enterを3回押して進む（パスフレーズは任意）
ステップ2：GitHubに公開鍵を登録
- 公開鍵をコピー
# Windows cat ~/.ssh/id_ed25519.pub | clip # Mac cat ~/.ssh/id_ed25519.pub | pbcopy # Linux cat ~/.ssh/id_ed25519.pub - GitHubで登録
- Settings → SSH and GPG keys
- New SSH key
- タイトル: VSCode
- Key: [貼り付け]
- Add SSH key
ステップ3：VSCodeで使用
# リモートURLをSSHに変更
git remote set-url origin git@github.com:username/repository.git
GitHub Copilotを有効化する
Copilotのサブスクリプション確認
- GitHub Copilotページにアクセス
https://github.com/features/copilot - プランを選択
- Individual: $10/月
- Business: $19/月
- 学生/教員: 無料
VSCodeでCopilotを設定
- 拡張機能をインストール
- 拡張機能タブ（Ctrl + Shift + X）
- 「GitHub Copilot」を検索
- インストール
- サインイン
- 通知「Sign in to GitHub」をクリック
- ブラウザで認証
- 使用開始
// コメントを書くと提案が表示 // 例：関数to convert celsius to fahrenheit
よくあるトラブルと解決法
Q1. 「認証に失敗しました」エラー
解決策：
- 認証情報をクリア
# Windows git config --global --unset credential.helper # Mac git credential-osxkeychain erase - VSCodeを再起動
- 再度サインイン
Q2. プッシュ時に403エラー
原因と対策：
- PAT期限切れ
- 新しいトークンを生成
- 権限を確認（repo権限必須）
- リポジトリの権限不足
- GitHubでCollaboratorに追加されているか確認
- 2段階認証が有効
- PATまたはSSHを使用（パスワードは使えない）
Q3. 「Permission denied (publickey)」
SSH関連のエラー：
# SSH接続テスト
ssh -T git@github.com
# 鍵の確認
ls -la ~/.ssh/
# ssh-agentに鍵を追加
ssh-add ~/.ssh/id_ed25519
Q4. Copilotが動作しない
確認事項：
- サブスクリプション状態
- GitHub → Settings → Copilot
- アクティブか確認
- 拡張機能の状態
- 有効になっているか
- 最新版か確認
- ファイルタイプ
- 対応言語か確認
- .gitignoreに入っていないか
複数アカウントの管理
個人用と仕事用を使い分け
方法1：プロファイル機能を使用
- 新しいプロファイルを作成
ファイル → 基本設定 → プロファイル → 新しいプロファイル - プロファイルごとにGitHubアカウント設定
方法2：ディレクトリごとに設定
# 仕事用ディレクトリ
cd ~/work-projects
git config user.name "Work Name"
git config user.email "work@company.com"
# 個人用ディレクトリ
cd ~/personal-projects
git config user.name "Personal Name"
git config user.email "personal@gmail.com"
セキュリティベストプラクティス
トークンの安全な管理
やるべきこと：
- ✅ 最小限の権限を付与
- ✅ 有効期限を設定（90日推奨）
- ✅ 定期的に更新
- ✅ 使わないトークンは削除
やってはいけないこと：
- ❌ トークンをコードにハードコード
- ❌ 公開リポジトリにコミット
- ❌ 無期限トークンの使用
- ❌ 全権限を付与
二段階認証の設定
GitHub側の設定：
- Settings → Password and authentication
- Two-factor authentication → Enable
- 認証アプリまたはSMSを設定
VSCodeでの対応：
- パスワード認証は使えなくなる
- PAT or SSH必須
拡張機能でGitHub連携を強化
必須の拡張機能
1. GitHub Pull Requests and Issues
機能：VSCode内でPR作成・レビュー
インストール：拡張機能で検索
2. GitLens
機能：Git履歴の可視化、blame表示
高度な差分表示
3. GitHub Actions
機能：Actions workflowの管理
CI/CD状態の確認
設定の同期
Settings Syncを有効化：
- 設定アイコン → 設定の同期をオンにする
- 同期する項目を選択
☑ 設定 ☑ キーボードショートカット ☑ 拡張機能 ☑ UIの状態 ☑ スニペット - GitHubアカウントでサインイン
これで、どのPCでも同じVSCode環境に！
プロジェクト別の推奨設定
オープンソースプロジェクト
// .vscode/settings.json
{
"git.enableCommitSigning": true,
"git.alwaysSignOff": true,
"github.gitProtocol": "https"
}
企業プロジェクト
{
"git.requireGitUserConfig": true,
"github.gitProtocol": "ssh",
"git.pruneOnFetch": true
}
個人プロジェクト
{
"git.autofetch": true,
"git.confirmSync": false,
"github.copilot.enable": {
"*": true
}
}
まとめ：VSCodeとGitHubの完璧な連携を実現！
VSCodeでのGitHubログイン、もう完璧ですね！
この記事の重要ポイント：
- 3つの認証方法
- GitHub認証（最も簡単）
- PAT（細かい制御）
- SSH（従来型）
- 推奨設定
- GitHub認証でログイン
- 二段階認証を有効化
- Copilotの活用
- トラブル対策
- 認証情報のクリア
- トークンの再生成
- 権限の確認
- 便利な活用
- 設定の同期
- 拡張機能の追加
- 複数アカウント管理
これで、GitHubと完全に統合されたVSCode環境の完成です！
効率的なコーディングライフを楽しんでください！💻🚀
コメント