Windowsでプログラミングを始めると、「WSL」「GitHub」「VSCode」をどうつなげればよいのか分かりにくいことがある。特に、Windows側とLinux側の違い、Gitの設定場所、SSHキーの登録で迷いやすい。
この記事では、WindowsにWSLを入れ、GitHubとHTTPS接続し、Visual Studio Code（VSCode）で開発できる状態にするまでの流れを初心者向けに整理する。コマンドを順番に実行すれば、WSL上のLinux環境でGitHubのリポジトリを扱い、VSCodeから編集できる開発環境を作れる。
WSL・GitHub・VSCodeの関係を先に理解する
WSLで開発する前に、それぞれの役割を理解しておくと設定で迷いにくい。
WSLは、Windows上でLinux環境を使える仕組みである。UbuntuなどのLinuxをWindows内で動かし、Linux用のコマンドや開発ツールを使えるようにする。
Personal Access Token（PAT）は、GitHubがパスワードの代わりに発行する認証用トークンである。HTTPSでGitHubに接続するときに使い、一度設定しておけば毎回入力する手間を省ける。
GitHubは、Gitで管理したソースコードを保存・共有するサービスである。自分のPCだけでなく、クラウド上にリポジトリを置けるため、バックアップや共同作業に向いている。
VSCodeは、ソースコードを編集するためのエディタである。WSL拡張機能を使うと、WindowsにインストールしたVSCodeからWSL内のファイルを直接編集できる。
この記事で作る環境
この記事では、次のような構成を作る。
- WindowsにWSLをインストールする
- WSL内にUbuntuを用意する
- WSL内にGitを設定する
- Personal Access Token（PAT）でGitHubとHTTPS接続する
- GitHubのリポジトリをWSL内にクローンする
- VSCodeでWSL内のプロジェクトを開く
ポイントは、開発作業の中心をWSL側に置くことだ。Linux向けの開発ツールを使う場合は、プロジェクトファイルもWSL内に置いたほうが扱いやすい。
WSLでGitHubとVSCodeを使うメリット・デメリット
WSLは便利だが、最初に知っておきたい注意点もある。メリットとデメリットを理解したうえで導入すると、後から混乱しにくい。
メリット1：WindowsのままLinux環境で開発できる
WSLを使う最大のメリットは、Windowsを使いながらLinuxの開発環境を利用できることだ。
Web開発やAI開発では、Linux前提のコマンドやツールが使われることが多い。WSLを使えば、Windowsを再インストールしたり、別のPCを用意したりしなくても、Linuxに近い環境で作業できる。
メリット2：GitHubとの連携がしやすい
WSL内にGitを設定しておけば、LinuxのターミナルからGitHubのリポジトリをクローンしたり、変更をプッシュしたりできる。
Personal Access Token（PAT）と認証情報ヘルパーを設定しておけば、毎回ユーザー名やトークンを入力する手間も減らせる。VSCodeのソース管理機能とも組み合わせやすくなる。
メリット3：VSCodeからWSL内のファイルを編集できる
VSCodeのWSL拡張機能を使うと、Windows側のVSCodeからWSL内のフォルダを開ける。
見た目は普段のVSCodeと同じだが、ターミナルや拡張機能はWSL側で動く。Linux環境でコマンドを実行しながら、VSCodeでコード編集できるのが大きな利点である。
デメリット1：Windows側とWSL側の違いで混乱しやすい
WSLでは、Windows側のファイルとLinux側のファイルが別の場所にある。
たとえば、Windowsの C:\Users\ユーザー名 は、WSLから見ると /mnt/c/Users/ユーザー名 のように見える。一方、WSL側のホームディレクトリは ~/ や /home/ユーザー名 である。
この違いを理解していないと、「どこにクローンしたのか分からない」「VSCodeで開いたフォルダが違う」といったトラブルが起きやすい。
デメリット2：初回設定の項目が多い
WSL、Git、GitHub、SSH、VSCode拡張機能を順番に設定する必要があるため、初回は少し手順が多く感じる。
ただし、一度設定してしまえば、日常的な作業は git pull、git add、git commit、git push などの基本操作が中心になる。
WSLでGitHubを接続してVSCodeで開発する準備手順
ここからは、実際の手順を順番に進める。コマンドは基本的にコピーして使えるが、メールアドレスやユーザー名は自分の環境に合わせて置き換える必要がある。
手順1：WindowsにWSLをインストールする
コマンドプロンプトを管理者として開き、次のコマンドを実行する。
wsl --installこのコマンドで、WSLに必要な機能とUbuntuがインストールされる。
WSLに必要な機能がインストールされていない場合は、まずその機能がインストールされる。
インストール後に再起動を求められた場合は、Windowsを再起動する。
再起動後に、再度コマンドプロンプトを管理者として開き、次のコマンドを実行する。
wsl --install
Ubuntuのインストール完了後にLinux用のユーザー名とパスワードを作成する。
ここで作るパスワードは、Windowsのログインパスワードとは別物である。
インストール状況を確認するには、PowerShellで次のコマンドを実行する。
wsl -l -vUbuntu の行が表示され、VERSION が 2 になっていれば、WSL2で動作している。
手順2：Ubuntuのパッケージを更新する
Ubuntuを開いたら、最初にパッケージ情報を更新する。
sudo apt update
sudo apt upgradesudo を実行すると、Ubuntuで設定したパスワードを求められる。入力中は画面に文字が表示されないが、入力自体は受け付けられている。
手順3：WSL内にGitをインストールする
UbuntuにはGitが入っていることもあるが、念のため確認しておく。
git --version
Gitが入っていない場合、または入れ直したい場合は次のコマンドを実行する。
sudo apt install gitGitを使う前に、ユーザー名とメールアドレスも設定する。
git config --global user.name "Your Name"
git config --global user.email "you@example.com"
git config --global init.defaultBranch main
Your Name にはGitのコミットに表示したい名前を入れる。you@example.com にはGitHubで使うメールアドレスを入れる。
設定できたか確認するには、次のコマンドを使う。
git config --global --list手順4：GitHubのPersonal Access Tokenを作成する
GitHubとHTTPSで接続するには、Personal Access Token（PAT）を使う。PATはパスワードの代わりに使う認証トークンで、一度作成しておけばWSL内からGitHubを操作できる。
GitHubの画面を開き、右上のプロフィール画像から Settings を開く。次に、左メニュー最下部の Developer settings を開き、Personal access tokens → Tokens (classic) を選ぶ。
Generate new token をクリックし、Generate new token (classic) を選ぶ。確認画面が出た場合はGitHubのパスワードで認証する。
入力欄には、次のように設定する。
| 項目 | 入力内容 |
|---|---|
| Note | WSL Ubuntu など、あとで分かる名前 |
| Expiration | 任意の有効期限（90日など） |
| Select scopes | repo にチェックを入れる |
設定後、Generate token をクリックする。表示されたトークンをコピーしておく。このトークンは一度しか表示されないため、メモ帳など安全な場所に一時保存しておく。
手順5：WSL内にGit認証情報ヘルパーを設定する
毎回トークンを入力しなくてよいよう、Git認証情報ヘルパーを設定する。WSL内のUbuntuターミナルで次のコマンドを実行する。
git config --global credential.helper storeこの設定により、初回のGit操作時に入力した認証情報が ~/.git-credentials に保存され、次回以降は自動で使われるようになる。
認証情報が正しく保存されているか確認するには、次のコマンドを使う。
git config --global --listcredential.helper=store の行が表示されていれば設定完了である。
手順6：HTTPS接続の動作を確認する
認証情報ヘルパーの動作確認は、実際にリポジトリをクローンする手順7で行う。ここでは、リモートURLのHTTPS形式を確認しておく。
GitHubのリポジトリ画面で Code をクリックし、HTTPS タブを選ぶと、次のような形式のURLが表示される。
https://github.com/ユーザー名/リポジトリ名.git
このURLをクローン時に使う。SSH形式（git@github.com:...）と間違えないよう注意する。
手順7：GitHubのリポジトリをWSL内にクローンする
作業用フォルダを作成し、その中にGitHubのリポジトリをクローンする。
mkdir -p ~/projects
cd ~/projects
git clone https://github.com/ユーザー名/リポジトリ名.git
cd リポジトリ名ユーザー名/リポジトリ名 は、自分のGitHubリポジトリに合わせて置き換える。
GitHubのリポジトリ画面で Code をクリックし、HTTPS を選ぶと、HTTPS用のクローンURLをコピーできる。
初回のcloneまたのpush時に、ユーザー名とパスワードの入力を求められる。ここのパスワード欄にはGitHubのログインパスワードではなく、手順4で作成したPersonal Access Tokenを入力する。認証情報は ~/.git-credentials に保存され、次回以降は自動で使われる。
手順8：VSCodeにWSL拡張機能を入れる
VSCodeはWindows側にインストールする。WSL内にVSCode本体を入れる必要はない。
VSCodeを開いたら、拡張機能から WSL を検索し、Microsoftの WSL 拡張機能をインストールする。複数のリモート開発を使う予定がある場合は、Remote Development 拡張パックを入れてもよい。
その後、WSLのUbuntuターミナルで、クローンしたリポジトリのフォルダに移動し、次のコマンドを実行する。
code .
初回はVSCode Serverのインストールが自動で行われる。少し待つと、VSCodeでWSL内のプロジェクトが開く。
VSCodeの左下に WSL: Ubuntu のような表示があれば、WSL環境として開けている。
手順9：VSCodeからGit操作を確認する
VSCodeでファイルを編集したら、ターミナルまたはソース管理画面からGit操作を確認する。
ターミナルで確認する場合は、次の流れが基本である。
git status
git add .
git commit -m "first commit"
git pushリモート側の変更を取り込むときは、次のコマンドを使う。
git pullVSCodeの左メニューにあるソース管理アイコンからも、変更ファイルの確認、ステージング、コミット、同期ができる。最初はコマンドで仕組みを理解し、慣れてきたらVSCodeの画面操作を併用すると分かりやすい。
WSL・GitHub・VSCode接続でよくあるつまずき
設定中にエラーが出た場合は、どこで失敗しているかを切り分けることが大切である。
wsl --install がうまく動かない
wsl --install がうまく動かない場合は、Windowsのバージョンが古い、またはWSLがすでに一部インストールされている可能性がある。
インストールできるディストリビューションを確認するには、次のコマンドを使う。
wsl --list --onlineUbuntuを指定してインストールする場合は、次のように実行する。
wsl --install -d UbuntuWindows Updateも確認しておくとよい。
Authentication failed や remote: Invalid username or password が表示される
HTTPS接続時に認証エラーが表示される場合は、認証情報の入力ミスやトークンの問題が多い。
次の点を確認する。
- ユーザー名欄にはGitHubのアカウント名を入力しているか
- パスワード欄にはGitHubのログインパスワードではなく、手順4で作成したPersonal Access Tokenを入力しているか
- PATの有効期限が切れていないか
- PATのscopesに
repoが含まれているか
保存済みの認証情報をリセットして再入力したい場合は、次のコマンドで削除できる。
rm ~/.git-credentials削除後に git pull や git push を実行すると、再度ユーザー名とPATの入力を求められる。
リモートURLがSSH形式になっている場合も認証エラーになる。次のコマンドで現在のURLを確認する。
git remote -vSSH形式（git@github.com:...）になっていた場合は、次のようにHTTPS形式へ変更する。
git remote set-url origin https://github.com/ユーザー名/リポジトリ名.gitcode . でVSCodeが開かない
code . でVSCodeが開かない場合は、VSCodeがWindows側に正しくインストールされていない、またはPATHが反映されていない可能性がある。
まず、VSCodeをWindows側で起動し、WSL拡張機能が入っているか確認する。その後、Ubuntuターミナルを閉じて開き直し、もう一度 code . を実行する。
VSCodeのインストール時に Add to PATH のような項目を有効にしていない場合は、再インストールや設定見直しが必要になることがある。
Windows側とWSL側のGit設定が別になっている
WindowsのPowerShellで設定したGitと、WSLのUbuntuで設定したGitは別物として考えたほうがよい。
たとえば、Windows側で git config --global user.name を設定していても、WSL側には反映されない場合がある。WSLで開発するなら、Ubuntuのターミナル内でGit設定を行うことが重要だ。
Ubuntuをリセットして作り直したい場合
設定がうまくいかず、Ubuntuを最初からやり直したいときは、WSLのディストリビューションを削除して再インストールする方法がある。
まず、現在インストールされているディストリビューションを確認する。PowerShellで次のコマンドを実行する。
wsl -l -v削除したいディストリビューション名（通常は Ubuntu）を確認したら、次のコマンドで削除する。
wsl --unregister Ubuntuこのコマンドを実行すると、Ubuntu内のすべてのファイル・設定・データが削除される。WSL側に置いていたプロジェクトのデータも失われるため、必要なファイルは事前にバックアップしておくこと。
削除後は、スタートメニューから Ubuntu を起動するか、次のコマンドで再インストールする。
wsl --install -d Ubuntu初回起動時に再度ユーザー名とパスワードを設定する画面が表示される。設定後は、手順2からやり直せばよい。
なお、Ubuntuのアプリ自体はスタートメニューに残ったままになることがある。気になる場合は、Windowsの「アプリと機能」からUbuntuをアンインストールしてから、Microsoftストアで再インストールする方法もある。
WSLで開発するときの注意点
WSL環境は便利だが、ファイルの置き場所や秘密鍵の扱いを間違えると、パフォーマンスやセキュリティの問題につながる。
プロジェクトはWSL内のホームディレクトリに置く
Linux用のツールを使って開発する場合、プロジェクトは ~/projects などWSL内に置くのがおすすめである。
Windows側の /mnt/c/Users/... にプロジェクトを置くこともできるが、ファイルアクセスが遅くなったり、権限や改行コードでトラブルが起きたりすることがある。
基本的には、次のようにWSL内に作業フォルダを作ると扱いやすい。
mkdir -p ~/projectsWindowsのエクスプローラーからWSL内のフォルダを開きたい場合は、対象フォルダで次のコマンドを実行する。
explorer.exe .Personal Access Tokenは安全な場所に保管する
Personal Access Token（PAT）は、GitHubの操作権限を持つ重要な認証情報である。
PATをチャット、メール、GitHubリポジトリなどに貼り付けてはいけない。また、credential.helper store で保存した ~/.git-credentials ファイルは平文で認証情報を保持するため、個人開発用PC以外での利用は避けることが望ましい。
PATが流出した可能性がある場合や、不要になった場合は、GitHubの Settings → Developer settings → Personal access tokens から該当のトークンを削除する。削除すればそのトークンは即座に無効になる。
改行コードの違いに注意する
WindowsとLinuxでは、ファイルの改行コードの扱いが異なる。設定によっては、内容を変更していないのにGit上では大量の差分が出ることがある。
チームで開発する場合は、.gitattributes やエディタ設定で改行コードを揃えるとよい。初心者のうちは、同じリポジトリをWindows側とWSL側の両方から直接編集しないようにすると混乱を減らせる。
エラーが出たら「どの環境で実行しているか」を確認する
WSLでは、PowerShell、Windows Terminal、Ubuntuターミナル、VSCodeの統合ターミナルなど、複数の実行場所が出てくる。
エラーが出たときは、まず次の点を確認する。
- PowerShellで実行するコマンドか
- Ubuntuターミナルで実行するコマンドか
- VSCodeがWSL接続で開いているか
- GitHubの接続URLがSSH形式か
同じ git コマンドでも、Windows側とWSL側では設定が違う場合がある。どこで実行しているかを意識するだけで、原因を見つけやすくなる。
まとめ
WSLでGitHubをHTTPS接続し、VSCodeで開発するには、WSLのインストール、Gitの設定、Personal Access Tokenの作成、Git認証情報ヘルパーの設定、VSCodeのWSL拡張機能の準備を順番に進めればよい。
初心者が特につまずきやすいのは、Windows側とWSL側の違いである。開発用のプロジェクトはWSL内の ~/projects などに置き、Git設定や認証情報ヘルパーもWSL側で設定するのが分かりやすい。
HTTPSでの接続は、SSHのキー生成や登録が不要なため、初心者でも導入コストが低く扱いやすい。一度環境を整えれば、普段の作業はVSCodeでファイルを編集し、GitでコミットしてGitHubへプッシュする流れになる。Windowsの使いやすさを残しながらLinux環境で開発したい場合、WSLとVSCodeの組み合わせは実用的な選択肢である。
SEOに配慮したキーワード候補
WSL,GitHub,VSCode,開発環境,Git,設定,code,コマンド,初心者,リポジトリ,クローン
コメント