React学習を始める前に、まずは開発環境をDockerで整えてみた。この記事ではDockerの基本と、実際にNginxコンテナを動かす手順を整理する。
Reactを学ぶ前に、まずは環境構築ということで、Dockerでやってみることにした。
Dockerを学ぶことで、React以外を学ぶときにもスムーズに環境を構築できるようになる（たぶん）。
今回はDockerの基本と、起動方法を学ぶ。
🐳 Dockerとは？
アプリを入れる“箱”を作るようなイメージ。
作業環境ごとに箱＝コンテナを作るので、環境同士は独立しており、干渉しない。
Dockerの仕様とか詳しい説明は、そういう説明をしている記事が山ほどある。
👉【入門】Dockerとは？概要やメリット、インストール方法をわかりやすく解説
👉Dockerがわからない人へ。これ1本で0から学べる丁寧なDocker入門
💡 メモ
以前はNode.jsとかをローカルに直接インストールしてたけど、Dockerを使えばローカルにインストールする必要がない。バージョンだとか作業環境だとかはコンテナごとに管理できるので便利。
⚙️ コンテナを作成して起動してみる
作業環境
- PC：Macbook Air 2020
- チップ：Apple M1
- macOS：Sequoia 15.6.1
ターミナルで以下のコマンドを実行してdockerを起動する。
docker run --rm -d --name nginx-handson -p 8082:80 nginx:alpine
コマンドの意味
-
docker run：dockerを起動する -
--rm：コンテナを停止したとき自動でそのコンテナを削除する。（一時的な作業の際につける。通常は不要） -
-d：デタッチドモード。バックグラウンドで実行する。 -
--name：コンテナに名前をつける。この場合はnginx-handsonとなり、実行する際にDocker start(or stop) nginx-handsonとすることができる。 -
-p：ポートの転送を行う。この場合はホストPCの8082ポートをDockerの80ポートに転送している。 -
nginx:alpine：今回使う イメージ 。 <リポジトリ名>:<タグ>で表現されている。
これで起動できたら、ブラウザでhttp://localhost:8082 アクセスしてみる。
✅ Nginxの「Welcome」ページが出たら成功！
💭🤔 イメージとは
コンテナを作るための「設計図」みたいなもの。
イメージ（テンプレート・設計図）をもとにしてコンテナ（実体）を作成する。
このイメージを共有することで、様々なマシンで同じコンテナ(実行環境)を動作させることができる。
また、イメージはdocker-Hubで公開されており、今回の nginx のように、指定するだけでインストールできる。その際に、タグを指定しなければ最新版の latest がインストールされるが、用途に合わせてバージョンを指定すると良い。
📒 まとめ
- dockerは、環境ごとに「箱(コンテナ)📦」を作るツール
- コンテナは実行環境ごとに独立しているので、いろんな環境を試せる
- イメージ＝設計図、コンテナ＝実体、という関係。
📘 次は docker-compose を使って、WordPress環境をまとめて立ち上げてみる予定。