125. URL Parameters（URLパラメータ：状態を「文字」として住所に刻む）

原理：URLに意味を込める

住所のあとの「おまけ」が、画面を決める

URLを見ていると、最後に ?q=apple&category=fruit といった、不思議な記号と文字が並んでいることがあります。これが「URLパラメータ（またはクエリパラメータ）」です。ブラウザはこのパラメータを見て、サーバーに「リンゴの検索結果が欲しいんだな」「カテゴリはフルーツだな」という細かい要求を伝えます。

HTMXで履歴管理（111-124）を行う際、このパラメータを正しく使いこなすことは、「今の画面の状態（何を検索したか等）をURLという名の文字列として保存する」ことを意味します。

実践：共有可能で正確な「状態」の保存

1. 入力のたびにURLを更新する（自動リンク）

検索窓の文字が変わるたびに、URLにその文字を刻み込んでいく例です。これにより、ブラウザの「戻る」が使えるようになり、URLのコピペで同じ結果を共有できるようになります。

<!-- 
  hx-get: 通信
  hx-replace-url="true": 今のURLの続きを自動で書き換える 
-->
<input type="text" name="search" 
       hx-get="/api/list" 
       hx-trigger="keyup changed delay:500ms" 
       hx-target="#results" 
       hx-replace-url="true">

2. パラメータの合成

複数のチェックボックスやセレクトボックスがある場合、HTMXはそれら全てを一つの長いパラメータ（例：?color=red&size=L）にまとめてサーバーへ送ってくれます。私たちはただ、適切な name 属性を付けておくだけでいいのです。

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

「状態」を名付ける: 検索文字なら q、ページ番号なら page といった、name 属性をタグに付けます。
連動させる: hx-push-url や hx-replace-url を使って、その値がURLバーに反映されるように設定します。
再現する: そのURLを直接開いたときに、サーバーが正しくパラメータを読み取って、期待通りのHTMLを返すようにプログラムを組みます。

比較：メモリ上の状態 vs URL上の状態

メモリ上の状態（JavaScriptの変数など）

メリット: 更新が速い。
デメリット: ページをリロードしたり、ブラウザを閉じたりすると、すべて消えてしまう（やり直しになる）。

URL上の状態（パラメータ）

メリット: リロードしても、ブラウザを閉じても、友達に送っても、「現在の状態」が完全に再現される。
デメリット: 複雑すぎるとURLが非常に長くなり、見た目が悪くなる。

まとめ：初心者のための「刻印」の技術

URLパラメータを正しく扱うことは、Webという広大な宇宙の中で、自分のページという「瞬間」を永遠に記録する行為です。

URLは「共有」のためにある: ユーザーが誰かにリンクを送ったとき、その人が自分と同じものを見れる。この当たり前を実現するために、パラメータを使いこなしましょう。
大事な情報だけを刻む: 全てのボタン操作をURLに入れる必要はありません。リロードしたときに「消えてほしくない重要な条件」だけを選んでパラメータにしましょう。
サーバーとの約束: パラメータは、ブラウザとサーバーの間の「共通言語」です。名前の付け方一つで、開発のしやすさが大きく変わります。

状態を文字に。住所に命を。URLパラメータという確かな記録の手法をマスターして、時を越え、場所を越えて、いつでも最高の状態からスタートできる、信頼性の高いWebアプリを完成させてください。

おめでとうございます！これで第6章「履歴とナビゲーション」の全15項目を完了しました。Webの「歴史」を操る力を手に入れたあなたは、もう立派なHTMXマスターの入り口に立っています。

次なる第7章（126〜）では、いよいよHTMXの真のパートナーである「サーバー」との、さらにディープな連携術「サーバー連携（Server Integration）」に挑みます！