🪟

WSL2で簡潔なLinux開発環境を作る

2024/04/21に公開

見るべき人

  • 開発・プログラミングを本格的に始めようと思っている初心者
  • よくわからずWindowsに直接Docker, Node.js, Pythonなどを入れている人

やりたいこと

WSL2内で完結する(Windowsを汚さない)、簡潔な開発環境を作る。

メリット

  • 標準的な開発環境が手に入る
  • Windowsをクリーンに保てる
  • Windowsがらみのよくわからんエラーに遭遇しにくくなる

はじめに

皆さんご存じの通り、Windowsは開発環境としてはあまり向いていません。そこで登場するのがWSL(Windows Subsystem for Linux)なわけですが、人によってはDocker, Node.js, etc...など開発に必要なアプリケーションはWindowsに入れたまま、WSLから実行という手法をとっています。
この方法が悪いとは思いませんが、手順が複雑だったり、Windows要因の何かしらのエラー(自分がなった)になる可能性もあります。
そこで、開発に必要なアプリケーションも込みですべてWSL内で完結させてしまうのがシンプルかつWindowsもクリーンに保てると感じたのでご紹介させていただきます。

環境

  • Windows 11
  • WSL2
  • Ubuntu 22.04.3
  • VSCode

事前準備

  • DockerがWindowsに入っている場合は消す
  • VSCodeのインストール

やったこと

実際にやったことを書いていきます。

WSLとUbuntuのインストール

まず、Microsoft公式ドキュメントを参考にWSLをインストールします。
https://learn.microsoft.com/ja-jp/windows/wsl/install

  1. PowerShellを起動し、以下のコマンドを実行します。
wsl --install
  1. インストールを完了させるためにWindowsを再起動します。
  2. WSL2を既定のバージョンにするため、以下のコマンドを実行します。
wsl --set-default-version 2
  1. Microsoft StoreからUbuntu(他のLinuxディストリビューションでも可)をインストールします。https://apps.microsoft.com/detail/9pn20msr04dw?hl=ja-JP&gl=JP
  2. インストールされたUbuntuを開くとユーザーの作成を求められるので、作成します。

WSLとUbuntuのインストールはこれで完了です。この時点でWindows上でUbuntuが動かせるようになっています。ここから、VSCodeの拡張機能を使ったり、Dockerを入れるなどして最低限の環境を構築していきます。

VSCode Remote Developmentのインストール

VSCodeを開き、拡張機能からRemote Developmentと検索し、インストールを押すだけ!

1.VSCodeの左下の青いボタンを押します。

2.WSLへの接続を押します

3.左下の青いボタンの表示がWSL: UbuntuとなっていればWSLを開けています!

ここから先は実質、UbuntuでVSCodeを開いてる状態になります。VSCodeのエクスプローラーからフォルダを開くを押すと、WSL上のディレクトリになっていることが確認できるかと思います。
自分はこの中にMyProjectsというフォルダを作り、ローカルレポジトリはPC上でここのみに置き、編集するときも必ずWSL上で行っています(おすすめ)。

DockerとNode.jsのインストール

あとはUbuntu {インストールしたいもの}という風に検索すればいくらでも記事は出てくるかと思いますので、そちらを参考にしていただければと思います。
ここでは最低限として自分が今回必要だったDockerとNode.jsのインストール方法を紹介します。

  • Docker
    1. 上の手順からVSCodeでWSLを開き、Ctrl + @でターミナルを開きます。
    2. 次のコマンドを実行します。(aptのソースの追加など)
    $ sudo apt update
    $ sudo apt install ca-certificates curl gnupg lsb-release
    $ sudo mkdir -p /etc/apt/keyrings
    $ curl -fsSL https://download.docker.com/linux/ubuntu/gpg | sudo gpg --dearmor -o /etc/apt/keyrings/docker.gpg
    $ sudo chmod a+r /etc/apt/keyrings/docker.gpg
    $ echo "deb [arch=$(dpkg --print-architecture) signed-by=/etc/apt/keyrings/docker.gpg] https://download.docker.com/linux/ubuntu $(lsb_release -cs) stable" | sudo tee /etc/apt/sources.list.d/docker.list > /dev/null
    
    1. パッケージ情報を更新し、最後にDockerのコンポーネントをインストールします。
    $ sudo apt update
    $ sudo apt install docker-ce docker-ce-cli containerd.io
    
  • Node.js
    1. とりあえずのNode.jsとnpmをインストール
    $ sudo apt install -y nodejs npm
    
    1. n(バージョン管理)をインストール
    $ sudo npm install n -g
    
    1. nを使って最新のNode.jsとnpmをインストール
    $ sudo n stable
    
    1. 最初に入れたとりあえずのNode.jsをアンインストール
    $ sudo apt purge -y nodejs
    $ sudo apt autoremove -y
    
    1. バージョン確認
    $ node -v
    

(おまけ) GitHubにWSLのSSH-Keyを登録する

WSL上でgitに接続するにはWindowsとは別にSSH-Keyの登録が必要になります。やり方としてはWindowsと変わりませんが一応紹介します。

  1. 秘密鍵と公開鍵を生成する。
ssh-keygen -t ed25519

3回入力を求められますが何も入力せずEnterでOK
2. 公開鍵をコピーする

cat ~/.ssh/id_ed25519.pub
  1. Githubに公開鍵を登録する。右上のプロフィール画像->設定->SSHキーとGPGキーから追加できます。

おわりに

この記事ではWindowsに簡潔なLinux開発環境を作る方法を紹介しました。
この方法を使うことで簡潔(Windowsを汚さない)かつ安全(変なエラーに遭遇しない)に開発を進められると思います。
最後までお読みいただきありがとうございました。

余談ですが...
自分はこの方法に移行してから「じゃあWindowsいらなくね?」ってなったので自宅のデスクトップPCはLinuxディストリビューションに乗り換えました(笑)。ですがWindowsも捨てきれない便利な部分はたくさんあるので、開発するときだけWSL、それ以外はWindowsという使い方が最強ではないかと思います。

Discussion