2026.09.23 泊まれる場所4,223 立ち寄りスポット59,693 営業中を確認したキャンプ場1,005 note を読む

自分のパソコンで正しく見えるページが、他人のパソコンで崩れる理由

自分の画面では何の問題もなく動くページが、別のパソコンで開くと崩れることがある。
コードは同じはずなのに、動かしている場所が違うと結果も違ってくる。
そこで、開発環境そのものを箱に詰めて配る、という考え方がある。

作業していたページを、別のパソコンで開くと崩れる。
自分の画面ではきれいに出ていたのに、という経験をした人は多いと思う。
同じコードを見ているはずなのに、結果が違う。
原因を追っていくと、自分のパソコンに入っているPHPのバージョンと、相手のパソコンに入っているPHPのバージョンが違っていた、という話はよくある。
コードは同じでも、動かす場所が違えば結果も違う。
当たり前のようで、つい甘く見てしまう。

「動く場所」は、思っているより人によって違う

ページを表示するまでには、いくつもの部品が関わっている。
プログラムを実行する仕組み(PHP)、データを保存しておく倉庫(データベース)、その二つを外に向けて配る係(Webサーバー)。
この三つのバージョンや設定が、パソコンごとに少しずつ違う。
新しく入れたパソコンなら最新版が入るし、古くから使っているパソコンなら古い版のまま止まっていることもある。
気づかないまま作業していて、いざ人に見せた瞬間に差が表に出る。
厄介なのは、差が出るのがいつも一番見せたいときだということだ。

環境ごと、箱に詰めて配る

この問題への答えのひとつが、コンテナという考え方だった。
プログラムだけを配るのではなく、それを動かすための環境ごと箱に詰めて配る。
料理にたとえると分かりやすい。
レシピだけを渡しても、相手の台所にあるコンロや鍋が違えば同じ味にはならない。
コンテナは、レシピと一緒に専用のキッチンごと届けるようなものだ。
中でどんな版のPHPが動いているか、どんな設定が入っているかを、箱の中に固定してしまう。
箱を開けば、誰のパソコンでも同じキッチンが立ち上がる。
Dockerは、その箱を作って動かすための道具だった。

1台のパソコンに、何十軒ものキッチンを置く

いくつもの案件を並行して抱えていると、案件の数だけキッチンが要る。
それぞれのキッチンには、その案件専用のPHPとプログラムが入っている。
ただ、キッチンを丸ごと案件の数だけ用意すると、パソコンの中はあっという間に部屋がいっぱいになる。
そこで、全部の案件で共通して使う部分だけをひとつにまとめることにした。

まとめたのは主に二つ。
ひとつは、外からの注文を受け取って正しいキッチンへ回す受付。
もうひとつは、どの案件のデータも保管しておく共有の倉庫。
受付と倉庫は一つだけ動かしておいて、案件ごとのキッチンだけを必要な数だけ足していく。
こうすると、パソコンの負担を抑えながら、案件どうしが混ざらない状態を保てる。

ここから書いていくのは、仕事で作っているContainer という国産のCMSを何十件もの案件で動かすなかで、少しずつ固まってきたやり方だ。

この連載で書いていくこと

ここから何回かに分けて、実際にどう組み立てているかを書いていく。

次回は、外からの注文を正しいキッチンへ振り分けている「受付」の話。
ひとつの入り口で何軒ものサイトを同時に捌く仕組みについて書く。
そのあとは、案件ごとのキッチンを増やすときにやっていること。
最後に、自分のパソコンなのに鍵マークが表示される、あの仕組みについて。

どれも、最初から分かっていたわけではない。
試しては直すうちに、少しずつ組み上げてきたものだ。
同じところでつまずく人の近道になればいいと思って、順番に残していく。

まる子パパ

まる子パパ

会社員。受託開発のエンジニアを15年以上続けていて、その前は寿司職人・長距離運転手・農業。 技術ブログは、キャンプの合間に踏んだバグと、AI・Web開発の運用の失敗を書いています。 このサイト自体が、開発に携わっているCMS「コンテナ」の稼働中の実例です。 このサイトについて / 小さな自動化の相談

—

ほかにも書いています

受託・note・スタンプ

※受託の相談とnoteは、運営者が個人で受けている・書いているものです。

技術ブログ一覧へ戻る