100. Status Code Handling（ステータスコード別処理：番号に合わせて「振る舞い」を変える）

原理：サーバーからの「短い合図」を読み解く

3桁の数字に込められたメッセージ

サーバーとブラウザが通信するとき、サーバーはHTMLと一緒に必ず「3桁の数字」を返しています。これが「HTTPステータスコード」です。 - 200: 「大成功！HTMLを送るよ」 - 404: 「ごめん、そんなページ（データ）はないよ」 - 500: 「ごめん、サーバーの中でエラーが起きちゃった」

HTMXは通常、200番台（成功）の時だけ画面を更新しますが、この「数字の種類によって、HTMXがどう動くかを細かく指示する」ことができます。これが「ステータスコード別処理」です。

番号ごとの対応を決めることで、アプリはより細やかで賢い反応を見せるようになります。

実践：番号に合わせた「神対応」を実装する

1. 成功（200）以外でも画面を更新したい（hx-target）

「データが見つからなかった（404）」というエラーメッセージを、特定のエリアに表示させたい場合の指示です。

<!-- 
  hx-target-404: 404エラーが返ってきた時だけ、#error-area を更新する 
  (※最新のHTMXや拡張でのテクニックです)
-->
<button hx-get="/api/users/999" hx-target="#main" hx-target-404="#error-area">
    ユーザーを探す
</button>

<div id="error-area"></div>

2. リダイレクト（303等）への対応

「保存が成功したら、別のページ（一覧画面など）へ飛ばしたい」とき、サーバーは300番台の番号を返します。HTMXはこれを受け取ると、自動でページ全体を新しいURLに移動させてくれます。

3. ステップ・バイ・ステップ解説

期待される番号を整理: 「正常」「入力ミス（422）」「権限なし（403）」など、起きうるパターンを考えます。
サーバー側の設定: それぞれの状況に合わせて、適切な番号をレスポンスに込めて返します。
イベントで制御: htmx:beforeSwap といったイベントの中で「もし403エラーなら、ログイン画面へ飛ばす」といったJavaScriptの短い命令を書くこともできます。

比較：すべてを 200 OK で返す vs 正しく数字を分ける

全て 200 OK（不親切な設計）

弊害: エラーが起きてもHTMXは「成功した」と思い込み、エラー画面で正常なページを上書きしてしまいます。デバッグも難しくなります。

正しくステータスコードを分ける（プロの設計）

利点: HTMXが「これは更新すべきHTMLか、それとも警告を出すべき事件か」を自動で判断できます。ブラウザの履歴やキャッシュも正しく働きます。

まとめ：初心者のための「共通言語」の活用

ステータスコードを正しく扱うことは、ブラウザ、サーバー、そしてHTMXという三者が「同じ言葉で会話する」ための基本です。

「204 No Content」を使いこなす: 「通信は成功したけど、画面は変えなくていいよ（073. noneに近い）」という時は、サーバーから 204 を返しましょう。これぞプロの振る舞いです。
422はバリデーションの味方: 入力ミスには 422。これさえ覚えておけば、HTMXでのフォーム制作は劇的に楽になります。
数字は嘘をつかない: ログを見た時に数字が並んでいるだけで、「何が起きたか」が一瞬でわかります。

3桁の数字を、アプリの知性に。ステータスコードという共通言語を通じて、どんな状況でも正確に、そして柔軟に反応できる、タフなWebアプリの基盤を完成させてください。第5章の前半戦が終了しました！101項目めからは、さらに実践的な「イベント制御」の世界が待っています。