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

0. 初めに

前回までで、WSL及びUbuntuのインストールを完了しました。
これで開発作業がスタートできるかと思いきや、まだやることがあります...
今日は、Docker Desktopというものをインストールします。
またなにやら、難しそうな言葉が出てきましたね...
ですが、落ち着いて一つずつやっていけば、きっと大丈夫なはず...!!
と信じて一緒にやっていきましょう。

最初からすべて完璧に理解できる人はいません。
「アプリケーション開発ってこんな感じなんだ」と雰囲気を掴んでもらうだけでもうれしいです！

また、上級者の方は、ぜひアドバイスをくださると励みになります。

1. Dockerとは？

今回の開発では、Dockerというものを使います。
このDocker（ドッカー）ですが、

あなたも、一回はどっか～で聞いたことがあるかもしれません...！

気を取り直して、説明を続けます。
こちらの【入門】Dockerとは？概要やメリット、インストール方法をわかりやすく解説という記事によりますと、

Dockerとは、軽量で高速に動作するコンテナ型仮想環境用のプラットフォームです。Dockerを使うことで、1台のサーバー上で様々なアプリケーションを手軽に仮想化・実行できるようになります。

ということらしいです。なるほどわからん。
要は、便利なやつってことです！ｗ

流石にそれだけだと、解説として雑すぎると思いますので、もう少しだけ書きますね💦

この後の少しネタバレになってしまいますが、アプリケーション開発を進めていくうえで、必須なものがあります。
例えば、プログラミン言語（性格にはその処理系）やデータベースサーバー・Webサーバー等用のミドルウェア等です。
要件定義・設計編（←リンク張る）でデータベース設計としてER図の作成行いましたが、実際にデータを保存したり取り出したりするMySQLなどがこれらの一つに該当します。
この必要なものたちを一つずつ、手動でインストールしていくと、意図せずバージョンがばらばらになってしまったり、そもそもインストール自体が面倒だったりと大変です。
しかし、Dockerを用いると、Dockerファイルというものを活用することで、これらのインストールやバージョン管理を、スムーズ行うことができて便利というわけです。
意図しないバージョンのズレも防げるという感じです。

アプリケーション開発をしたことがない方は、ピンとこないと思います。
実際に作業をしていくうえで、具体例を確認していってもらえればうれしいです。

2. Docker Desktopインストール

Dockerの仕組みを利用できるようにしたサービスはいくつがありますが、メジャーなものだと、Docker Desktopというものがあります。
今回もこのDocker Desktopを使います！

Docker Desktopをインストール

さっそくDokcer Desktopをインストールしていきます。
個人利用の場合は、無料で使えるのでご安心ください。
以下のサイトから「Docker Desktopをダウンロードする」をクリックします。
https://www.docker.com/ja-jp/get-started/
そうると、「Windows版のダウンロードAMD64」が出てくるので、クリック。

すると、インストール用のファイルがダウンロードできるので、インストーラーを立ち上げて指示に従ってインストールを完了してください。

※ちなみに、AMD64というのはCPUのアーキテクチャの種類のことで、Ubuntu上で

$ uname -m

を実行すると、以下のような画面になり、確認ができます。

まあ、そんなに気にしなくてもいいと思います。
もし、うまくいかなかったらごめんなさい...

インストールできたら、例によって、タスクバーのWindowsアイコンをクリックして、「Docker Desktop」と入力して、アプリを見つけて、開きましょう！

こんな画面になるかなと思います（初めての人は、コンテナがないと思いますが、大丈夫です）。

これにて、Docker Desktopのインストール自体は完了です。

Ubuntu上でDockerを動かせるようにする

ここから、Ubuntu上でDocker Desktopを使えるように少し設定をします。
画面右上の歯車のアイコンから、設定画面を開いて、画面左の「Resources」の中の「WSL integration」をクリックしてください。

もし、「Ubuntu」の部分が上のようにオンになっていなければ、オンにして右下のApply & restartをクリックしてみてください。

いよいよ、Linuxコマンド打っていきます！（エンジニアっぽくなってきました！楽しみましょう～）

Docker Desktopは開いたままで、Ubuntu上で

$ docker --version

を実行してみましょう！

使えるDockerのバージョンが出てきました！

$ docker run hello-world

を実行して、仮のコンテナ（説明は後程致します）を立ち上げてみます。

めちゃくちゃ英語が書いてあって「なんじゃこりゃ」と思いますが、途中に、
"Hello from Docker!
This message shows that your installation appears to be working correctly".
と書いてあるのが分かります。うまくいっているっぽいですね。（笑）
実はこのコマンドは、Ubuntu上でDockerを正常に動かせるかどうかを確認するためのコマンドだったのです！無事にできたようでよかったです！

※もしかしたら、権限不足でエラーになってしまう場合もあるかもしれません。
その場合は、別途コマンドを実行して権限を付与してあげる必要があります。
本来は、管理者と作業者等で権限を分けたりするのが一般的なのですが、まあ、僕は個人開発なので、そのまま一人のユーザーに全部の権限を与えて作業していってもいいかなと思います...

詳しくは、【WSL】UbuntuからWindows版Docker Desktopを使いたいを参考にしてみてください。
その他、うまくいかない等があれば、読んでみてください。
僕も正直これを見ながら書いてますｗ
なので、最初からこれを読んだ方が早いと思います。
すみません(>_<)

3. Dockerでphp, nginx, mariaDBの環境構築

難しい内容が続いて、正直疲れたと思います。
適宜休憩を取ってください！長続きのコツです。

疲れが取れたら、もうひと踏ん張りしましょう！

Dockerコンテナ・イメージについて

先ほど、Dockerでは、アプリケーション開発をするうえで必要なものをDockerファイルを用いることで、管理することができると言いました。
その必要なものというのが、今回は３つあります！
それが、phpとnginxとmariaDBです。

最初のphpというのは、プログラミング言語です！
多分この記事を読んでいるあなたなら聞いたことがあるはずです！
正確には、今回はphpという言語を実行する環境という意味でのphpをインストールします。

実は、プログラミング言語というのは、あくまで言語であってそれ自体では何もできません。日本語という言語だけが存在していても、日本語を書いたり話したりできる人がいないと誰にも伝わらないし、言語としての機能が失われてしまうのと同じです。
phpという言語を処理するには、phpインタープリター（もしくはphpエンジン）（横文字が多くてすみません）というものが必要になります。
phpと単にいうだけではなくて、本当は言語とこの処理系を区別して呼んだ方が誤解がないのですが、紛らわしいですよね...
この辺は正直細かい話なので、いったん忘れてもらってもよいと思います。（笑）
要はphpが必要なんですよ！（雑）

このphpを普通にインストールしてもよいんですけど、せっかくなのでDockerを使って用意しましょうというわけです。

ここで、出てくる用語がコンテナとイメージです。

まず、コンテナは、ざっくり言うと、このphpが動くために必要なもの一式が入った箱のようなもののことです！！
正しくは、仮想環境とかって言ったりするのですが、難しいですよね。
仮想化技術については、コンピュータサイエンスの知識を勉強する必要があるので、機会があればまとめてみたいと思います！
とりあえずは、アプリケーション開発に必要な環境を実現するものだとざっくり思ってもらえればありがたいです。

次に、イメージですが、これは「コンテナを作成するためのひな形」みたいなものだと思ってください。正しくは、「テンプレートファイル」と言うそうです。
イメージをRun（実行）することで、コンテナが立ち上がり、アプリケーション開発に必要な状態を簡単に創り出せるという感じです。

Dockerファイルとは？

このイメージの設計図のようなものがDockerファイルと呼ばれています。
このDockerファイルはテキストファイルなので、これさえうまく作ることができれば（正確にはDockerコマンド等のCLI操作も必要ですが）、ボタンをポチポチして一つずつバージョンをそろえてインストールしなくてもよくなります。

流れとしては、「Dockerファイルを使って、イメージを作成。その後イメージをRunして、コンテナを立ち上げる」という感じです。
なんとなく、分かりましたか？ピンときにくいですよね💦
次回からは実際にDockerファイルを作っていきますので、少しずつ慣れていきましょう！

4. まとめ・次回予告

今回は、アプリケーションに必要な仮想環境を構築するためにDocker Desktopをインストールしました。また、Dockerファイルについてざっくりと説明いたしました。
次回からついにプロジェクトを作成していきますので、ようやく「開発している感」を得られるのではないかと思います！

また、このシリーズでは、Web開発の流れの雰囲気をつかんでもらうのと僕の備忘録的な目的のためのものなので、Dockerについての説明はかなりあっさりしてしまいました。
もし、もっと詳しく知りたい方は、ぜひ調べてみてください。
こちらの
【Docker入門】初心者向け！Dockerの基本を学んでコンテナ型の仮想環境を作ろう！
では、「Dockerとは何か？」また、Dockerファイルの使い方やDockerコマンドの使い方まで解説されているので、次回の予習にぴったりでおすすめです！

Dockerは難しいと思いますが、一度環境を作ってしまうと、開発中はよく使うコマンドさえ使いこなせれば、そこまで大きな負担にはならないと思いますので、次回を乗り切りましょう！
私も正直まだまだ理解が足りていないのが現状です。

それでは、また次回お会いしましょう。

参考

・【入門】Dockerとは？概要やメリット、インストール方法をわかりやすく解説
・【WSL】UbuntuからWindows版Docker Desktopを使いたい
・【Docker入門】初心者向け！Dockerの基本を学んでコンテナ型の仮想環境を作ろう！

これまでの記事一覧

・その１: 要件定義・設計編
・その２: 環境構築編① ~WSL, Ubuntuインストール~