その修正、いきなり本番で試していませんか——ローカル開発環境という練習場

本番のサイトを開いたまま、CSSを1行だけ直したことはありませんか。
「これくらいなら大丈夫」と思って触ったその1行で、スマートフォンの表示だけが崩れる。
私も昔、金曜の夕方にやってしまって、週末じゅう気が気でなかったことがあります。
直すのが怖いサイトは、だんだん更新されなくなっていきます。

この怖さは腕の問題ではなく、場所の問題だと思う。
試す場所が本番しかないから、本番で試すことになる。
手元のパソコンの中に本番とそっくり同じサイトをもう1つ立てておけば、そこでいくら壊しても誰にも見えません。
これがローカル開発環境です。

コンテナでは、案件のフォルダを受け取った時点でその一式が同梱されています。
用意するのは Docker Desktop を1つ入れておくことだけ。
あとは案件フォルダの中の cms/dev に移動して、dev.env.example を dev.env という名前でコピーします。
開いて直すのは案件名と、使うポート番号くらいです。
ポート番号は案件ごとに必ず違う値にしておいてください。ここを使い回すと、2つ目の案件を起動したときにぶつかります。

準備ができたら、PowerShell で up.ps1 を実行します。
初回はコンテナの構築とデータベースの投入まで自動で走るので、少しだけ待ち時間があります。
終わったら http://localhost:8090/__ctnAdmin/ のように、指定したポートの管理画面が開きます。
-Tools を付けて起動すると phpMyAdmin も一緒に立ち上がるので、データベースの中身を画面から覗けます。
やめるときは down.ps1 で、データを残したまま止まります。

この仕組みのいいところは、本番用の設定ファイルを一切書き換えずに済むところです。
起動するときに開発用のデータベース接続を外から渡しているので、案件フォルダの中身は本番のまま動きます。
使う PHP のバージョンやデータベースの版も設定1行で切り替えられるので、サーバーを更新する前に手元で確かめられます。
「本番と同じ条件で確かめてから上げる」が、当たり前にできるようになる。

つまずきやすいところも3つだけ書いておきます。
ひとつはポート番号の重複で、起動に失敗したらまずここを疑ってください。
ふたつめは、初期データが入るのは本当に最初の1回だけということ。入れ直したいときは down.ps1 にボリューム削除の指定を付けて消してから、起動し直します。
みっつめは、フォルダをコピーしてきた直後にライブラリが入っていない場合で、これは web コンテナの中で composer install を1回走らせれば直ります。

ローカル環境を用意する時間は、長く見ても半日ほど。
その半日で、「本番で試すしかない」という状態から抜け出せます。
壊してもいい場所があると、人は思い切って直せるようになる。
サイトが古びていく原因の何割かは、たぶんこの怖さのほうにあるのではないだろうか。
テンプレートの構造については3層構築のページもあわせてご覧ください。