URL を分けて読む
URL は、いくつかの部品でできています。色の付いた所を押すと、その部品の意味が出ます。
URL を打ってから画面が出るまで
全部で 11 歩。「次へ」で 1 歩ずつ進むと、データが図の上を動きます。番号を押せば、好きな所へ飛べます。ふつうはこれが 1 秒もかからずに起きています。 中で何が起きているかはネットワークの深掘りへ。
HTTP のやりとり
ブラウザとサーバーは、決まった形の「頼み（リクエスト）」と「返事（レスポンス）」をやりとりしています。HTTP/2・HTTP/3 では送り方の形は違いますが、中身（メソッド・ヘッダー・状態コード）は同じです。
リクエスト（頼み）
レスポンス（返事）
メソッド（どうしてほしいか）
安全: サーバーの中身を変えない。冪等（べきとう）: 何回送っても結果が同じで、通信が切れて送り直しても困らない。どちらも HTTP の決まり（RFC 9110）での定義です。PATCH は別の文書で決まっていて、冪等とは限りません。
状態コード（返事の最初の 3 けた）
百の位で、だいたいの意味が分かります。番号を押すと、意味と、どこを直せばよいかが出ます。 状態コードはAPI 設計の練習台で、実際に出してみられます。
「ログイン中」を覚える仕組み
HTTP は、1 回ずつのやりとりが独立していて、前のやりとりを覚えていません。そこで、目印を毎回いっしょに送って「同じ人だ」と分かるようにしています。
速くする仕組み
いちばん速い通信は「しない通信」。覚えておく・近くから返す・送る量を減らす、の組み合わせです。
Web API（画面ではなく、データを返す）
スマホアプリや画面の JavaScript は、HTML ではなく JSON というデータの形でサーバーとやりとりします。技術の地図で API の層を見る ↗ 設計の決まりごとや練習台はAPI 設計のタブへ。
REST の形（URL で「何を」、メソッドで「どうする」）
返ってくる JSON の例
JavaScript から呼ぶ例
画面の作り方（どこで HTML を作るか）
同じページでも、HTML をブラウザで作るか、サーバーで作るか、前もって作っておくかで、速さや向き不向きが変わります。技術の地図でフロントエンドの層を見る ↗
AI 時代の Web
Web を読みにくるのは、人とふつうの検索エンジンだけではなくなりました。AI に読まれる・AI がつながる・AI が操作する、を前提に作ります。
表示されないときに確かめる順
上の 11 歩の、どこで止まっているかを探します。押すと、その歩きの説明に飛びます。道具はブラウザの開発者ツール（Network とコンソール）です。 原因の探し方はデバッグのタブへ。
やりがちなミス（チェックリスト）
自分の作ったものを確かめたら、チェックを付けてみてください（この端末にだけ保存されます）。