AI時代のプログラミング学習カリキュラム第1講 コードが動くまでに何が起きているか
🗺 目次
AI時代のプログラミング学習カリキュラム 第1部 地図をもつ

第1講 コードが動くまでに何が起きているか

📖 無料講座・全25講 2026-08-17 秋元進吾 AI活用 プログラミング 講座

この講で解けるようになる困りごと

友人から「サイトが見られないよ」と連絡が来ました。あなたは自分のパソコンで開いてみます。ちゃんと見えます。
さて、これは誰の問題でしょうか。

答えを出すには、いま自分が見ている画面が"どこから来たのか"を知っている必要があります。それを知らないと、「私のほうでは見えるんだけどな・・・」で会話が終わってしまう。原因を探そうにも、探す場所が分からないからです。

この講のゴールはひとつだけ。画面が表示されるまでに登場する"関係者"を覚えること。これだけで、トラブルのときに見る場所が決まります。


仕組み

Webサイトが表示されるまでを、飲食店にたとえます。

登場人物は3人です。

あなたがURLを開くと、こういうことが起きています。

  1. 客席から注文が出る(このページをください)
  2. ホールが厨房へ運ぶ
  3. 厨房が料理を用意する(HTMLやCSSや画像を返す)
  4. ホールが客席へ運ぶ
  5. 客席で盛り付けられる(ブラウザが画面を組み立てる)

ここで大事なのは、"あなたが見ているのは、5番の結果だけ"だということです。

料理が出てこないとき、原因は1から5のどこにでもあり得ます。注文が届いていないのか、厨房が止まっているのか、ホールが迷子なのか。画面をどれだけにらんでも分からないのは当然で、画面は最後の1コマにすぎないからです。

冒頭の「私には見えるが友人には見えない」も、これで見当がつきます。厨房が止まっているなら、全員に見えないはずです。あなたに見えているということは、厨房は生きている。つまり疑うべきは、友人側の客席か、そこまでの経路のほうです。

登場人物には、もう1人だけ続きがあります。"作り置き"です。

同じ注文が続くと、いちいち厨房まで行かず、作り置き(キャッシュ=一度届けたものを取っておいて使い回す仕組み)が出てくることがあります。客席側にも作り置きの棚があって、ブラウザは前回の材料を勝手に使い回します。表示を速くするための親切な仕組みですが、副作用がひとつ。"更新したのに変わらない"という、初心者をいちばん悩ませる現象の正体が、たいていこれです。厨房の料理はもう新しいのに、手元に届くのは古い作り置き。壊れたわけではないので、直そうとしてはいけません。作り置きを飛ばして届け直させる操作(強制再読み込み)をひとつ覚えれば済みます。

最後に、初心者がいちばん混乱するところを整理しておきます。

この3つは別物で、契約している会社もバラバラなことがよくあります。ここを「全部ひとかたまり」だと思っていると、あとで痛い目にあいます(後述)。


✍️ 手元で確かめる(5分)

自分の一枚、または自分のサイトを開いてください。

  1. ページ上で右クリックし、「検証」または「開発者ツール」を選ぶ
  2. 上部のタブから「Network」(ネットワーク)を選ぶ
  3. その状態でページを再読み込みする

ずらずらと一覧が流れます。これが"ホールスタッフが運んだものの伝票"です。

見てほしいのは3つだけ。

  • Name:運ばれたファイルの名前
  • Status:200なら成功、404なら「そんなものは無い」、500なら「厨房で事故」
  • Time:かかった時間

最後にひとつ。強制再読み込み(Windowsは Ctrl+Shift+R、Macは command+shift+R)を押してみてください。作り置きを使わず、全部の荷物が届き直すのが伝票で見えます。この操作は、この先ずっと使います。

全部を理解する必要はありません。「画面は1枚ではなく、たくさんの荷物が届いて組み立てられている」という事実が体で分かれば、この講は達成です。


💬 AIへの質問例

そのまま貼って使えます。

  1. 「私はプログラミング初心者で、いまブラウザの開発者ツールのNetworkタブを開いています。この一覧が何を表しているのか、飲食店にたとえて説明してください」
  2. 「自分のサイトを開いたら、あるファイルに(数字)というステータスが出ていました。この数字の意味、よくある原因、私が最初に確認すべきこと、の順で教えてください」
  3. 「私のサイトが、自分には見えるのに他の人には見えないそうです。ブラウザ側・通信・サーバー側・作り置き(キャッシュ)のどれから疑うべきか、確認しやすい順に並べてください」

3つ目の"確認しやすい順に"は、この先ずっと使う言い回しです。覚えておいてください。


⚠️ やってはいけないこと

ドメイン・サーバー・サイトを同じものだと思い込んだまま、契約を解約すること。

よくある事故がこれです。「サイトを作り直すから、いまの契約はいらないな」と解約したら、独自ドメインで受けていたメールまで止まった。あるいは、ドメインだけ更新し忘れて失効し、他人に取られて二度と戻らない。

覚え方はこうです。住所(ドメイン)、店舗(サーバー)、料理(サイト)。どれか一つを手放すとき、他の二つに何が起きるかを必ず確認する。

もうひとつ、小さいけれど多い事故を。更新が反映されないだけなのに、壊れたと思ってあちこち触ってしまい、本当に壊すこと。表示が変わらないときは、直す前にまず強制再読み込み。順番はいつもこれです。


📌 まとめ

  • 画面は"届いた結果"。原因は必ず、客席・ホール・厨房・作り置きのどこかにある
  • 見えない相手がいるときは、まず自分に見えるかどうかで疑う場所が半分に絞れる
  • ドメイン・サーバー・サイトは別物。契約をいじる前に、他の二つへの影響を確認する