実務未経験エンジニアがLaravel&ReactでWebアプリケーション開発に挑戦してみた！（環境構築編①）~WSL, Ubuntuインストール~

# 実務未経験エンジニアがLaravel&ReactでWebアプリケーション開発に挑戦してみた！（その２）

## 0. 初めに
みなさん、こんにちは！
**荒木.php**と申します。

このシリーズでは、タイトルの通り、実務未経験エンジニア（就職はしているけど研修期間中）の僕がLaravelとReactを使って、一からWebアプリケーションを開発する様子をお届けしております！
PCのOSはWindows11です。


今回から、環境構築編スタートということで、実際に手を動かして作業をしていきます！
初心者の方は、わかる範囲だけでも構わないので一緒にやっていきましょう～！
僕もまだまだ初心者なので、同じ初心者同士で共感しあえる部分があるかと思います('ω')

[前回の記事](https://qiita.com/ArakiPhp/items/3406a08b3291a32e315b)は読んでくださいましたでしょうか？
もしまだなら、ぜひ読んでみてくださると幸いです。

## 1. WSLインストール

さて、前回で要件定義と設計を完了しました。
「じゃあ、さっそく作るぞ！」っと思ったかもしれませんが、アプリケーションを開発するには、準備が必須です！
調理器具や材料がないのにいきなり料理をしようとしても無理なのと一緒です。
アプリケーション開発においても、開発をするための環境を用意する必要があります！

これから、いろんなものをインストールしたり、設定したりしますが、これがひじょ～に面倒！！
だけど、やるしかない...
一つずつやっていきましょう！！！！

まずは、**WSL**（Windows Subsystem for Linux）をインストールします！
またまた、難しそうな言葉ですね💦
一つずつ見ていきましょう。

まず、WindowsはPCのOSの一つです。
OS（オペレーティングシステム）というのは、PCを動かすためのソフトウェアです。
いわゆるWindowsのPCには、このWindows OSが搭載されています。
他にもMac OSやLinux OSなどがあります。
次に、Subsystemですが、そのまんま、「サブのシステム」です！！
最後の、**Linux**というのは、前述の通り、OSの一種（厳密にはOSの中核を担う**カーネル**と呼ばれるソフトウェアのことだけど、細かい話は置いておきます！）です。
つまり、WSLというのは、「Linux OSのためのWindowsのサブシステム」という意味ですね。

WindowsのPCには、Windows OSが搭載されていると言いましたが、WindowsのPCでMac用のアプリケーションが使えないように、他のOSで別のOSを動かすことは基本的にはできません！
つまり、WindowsのPCでは、Linuxは扱えないということになります。
でも、今回はPCはWindowsだけど、どうにかLinuxで開発したい！
そこで、このWSLをインストールするわけです

WSLを使えば、Windows上でLinux環境を構築・実行できるようになります！
じゃあ、「どうしてそんな面倒なことをしてまで、Linuxを使いたいのか？」という疑問が浮かぶと思います。

**...それな！！**

僕にもわかりません！調べてください！（笑）
なぜかLinuxが良いらしいです。僕もLinuxのコマンド（プログラムを実行する命令）が使い慣れているという理由でぶっちゃけ選んでいます（ヨクナイデスネ...）。
一応、Geminiにも聞いてみたのですが、

**1. 無償で利用できるオープンソースであること**
**2. 豊富なサーバーソフトウェアとの親和性**
**3. 高い安定性と信頼性**
**4. コマンドラインインターフェース（CLI）の強力さ**
**5. ハードウェアの選択肢が豊富**
**6. 活発なコミュニティと豊富な情報**

などの魅力がLinuxにはあるそうです（よくわからんけど）。
今後、経験を積んでいけば、いずれ実感できるようになる日が来るでしょう！！

ながながと説明しましたが、要はWSLというものをインストールすればよいという話です。
タスクバーのWindowsのアイコンをクリックして、「cmd」と打って、コマンドプロンプトを探しましょう。

![スクリーンショット 2025-05-04 105032.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/4075450/5e21c26e-d9bb-4e6e-8ba6-6cfb77e4c58a.png)

Enterを押すと、コマンドプロンプトが起動して、黒い画面が表示されます！

![スクリーンショット 2025-05-04 105408.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/4075450/28e49963-09a7-4599-b60f-6512a6764526.png)

ここに、コマンドを入力して、コンピューターを動かしていきます。
なんだかプログラマーっぽい画面ですね。(≧◇≦)

しかし、この段階ではまだ、Windowsのコマンドしか使えません。
さっそく、
```cmd:
wsl install
```
を入力して、Enterボタンを押して、インストールしましょう！
僕は、インストール済みなので、
```cmd:
wsl -l -v
```
を実行して、WSLのバージョンを確認しました！
![スクリーンショット 2025-05-04 110712.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/4075450/af873ae5-6bea-4b8c-9ee6-042ab1d46938.png)

現在は、何も設定をいじらなければ、最新のWSL2がインストールされるはずです。
若干、僕と画面が違うかもしれませんが、バージョン2がインストールされたことが確認できればOKです！

もし、うまくいかない場合は、[WSL を使用して Windows に Linux をインストールする方法](https://learn.microsoft.com/ja-jp/windows/wsl/install)または、[wsl2にUbuntu環境を構築する【windows】](https://qiita.com/ryome/items/240f36923f5cb989da27)を参考にしてみてください。
これで、WSLのインストールは完了です！

## 2. Ubuntuインストール

「よし、WSLがインストールできたから、Linuxを使ってさっそく開発するぞ！」と思ったかもしれませんが、残念ながらまだできません！(´；ω；`)ｳｩｩ

WSLはあくまで、「Windows上でLinux環境を動作させるための基盤となる仕組み」でしかないため、Linuxを実際に使うためには、**Linuxディストリビューション**というものを別途インストールしないといけません（ややこしい）！

Linuxディストリビューションというのは、簡単に説明すると、LinuxをOSとして利用するために必要なソフトウェアなどを集めてパッケージ化して配布しているサービスです。
本当は、OSの話はもっと奥が深いのですが、今日はこのくらいの説明で勘弁してください...

今回は、**Ubuntu**というLinuxディストリビューションの中でもシェアが高く、無料で、しかも使いやすいものがあるので、それをインストールします！

```cmd:
wsl --install -d Ubuntu
```
を実行して、Ubuntuをインストールしましょう！
インストールができたら、
```cmd:
Ubuntu
```
を実行して、Ubuntuを起動しましょう！

![スクリーンショット 2025-05-04 112642.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/4075450/9ed937a0-7dab-4580-b903-8456129cd130.png)

僕のバージョンはこんな感じです。
これで、Ubuntuのインストールは完了です！
うまくいかない場合は、こちらの[wsl2にUbuntu環境を構築する【windows】](https://qiita.com/ryome/items/240f36923f5cb989da27)という記事を読んでみてください。
また、インストール時にLinux管理ユーザーの作成を迫られるかもしれませんが、指示に従って、名前とパスワードを決めて作成してください。
もし、作成し損ねた・新しいユーザーを作成したい等がありましたら、[WSL2 Ubuntuの導入でLinux管理ユーザを登録し損ねた](https://zenn.dev/ikkik/articles/462feec65f53f8)や[Linuxでユーザを作る方法と初期設定ですること](https://qiita.com/rokkouribo/items/c517cefc5e08b8085261)などを参考にしてもらえると、たぶんうまくいくと思います。
どうしてもできないときは、ChatGPTに聞きましょう！

## 3. まとめ・次回予告

というわけで、今回はWindowsのPCでLinux環境を構築するために、WSL及びUbuntuをインストールしました！
「これでやっと開発ができる‼」と言いたいところですが、まだ続きがありますので、引き続き環境構築編をご購読ください！（笑）
では、次回の記事でお会いしましょう！

## 参考

・[WSL を使用して Windows に Linux をインストールする方法](https://learn.microsoft.com/ja-jp/windows/wsl/install)
・[wsl2にUbuntu環境を構築する【windows】](https://qiita.com/ryome/items/240f36923f5cb989da27)
・[WSL2 Ubuntuの導入でLinux管理ユーザを登録し損ねた](https://zenn.dev/ikkik/articles/462feec65f53f8)
・[Linuxでユーザを作る方法と初期設定ですること](https://qiita.com/rokkouribo/items/c517cefc5e08b8085261)


## これまでの記事一覧
・[その１: 要件定義・設計編](https://qiita.com/ArakiPhp/items/3406a08b3291a32e315b)