043. PUT（データの置換：丸ごと最新の状態へ上書きする）

原理：「完全な入れ替え」という潔さ

PUTリクエストの役割とRESTの精神

「PUT（プット）」は、HTTPの世界における「更新」を担当する重要な動使です。 POSTが「新しいものを付け足す」イメージなのに対し、PUTは「そこにあるものを、今私が持っている新しいもので完全に置き換える（置換）」という非常にクリーンな目的を持ちます。

PUTの最大の特徴は「等巾（とうきん）性」です。これは、「全く同じデータを何度PUT（上書き）し続けても、結果は一回やった時と同じまま維持される」という性質を指します。 - 1回PUTする → データが新しくなる。 - 100回同じデータをPUTする → データはやはり新しくなったまま（100個増えたりはしない）。この性質があるため、ネットワークが不安定で通信をやり直したときでも、不要なデータ増殖などのトラブルが起きにくく、非常に安全です。

HTMLが忘れていた「更新」の手段

標準のHTMLではGETとPOSTしか扱えなかったため、これまでは更新処理であってもPOSTを使い、サーバー側で「もし存在すれば更新、なければ作成」といった曖昧なコードを書くことが多々ありました。 HTMXの hx-put は、この「更新」という処理を、本来の正しい名前（PUT）で定義できるようにします。

実践：プロフィールの「完全更新」を実現する

1. プロフィール編集の標準フロー

情報を一気に上書きし、画面を最新の表示に戻す例です。

<!-- profile.html -->
<div id="profile-card">
    <p>名前：山田太郎</p>
    <p>メール：yamada@example.com</p>

    <!-- サーバーに「編集用フォーム」を要求する -->
    <button hx-get="/profile/edit" hx-target="#profile-card">
        編集する
    </button>
</div>

<!-- (サーバーが返す編集用フォームのイメージ) -->
<form hx-put="/api/profile/1" hx-target="#profile-card">
    <input type="text" name="name" value="山田太郎">
    <input type="email" name="email" value="yamada@example.com">
    <button type="submit">保存して更新</button>
</form>

2. 設定のオン・オフ切り替え

「現在の設定状態」を丸ごと上書き保存する際にも、PUTの潔さが活きます。

<div id="notification-settings">
    <input type="checkbox" name="active" checked
           hx-put="/api/settings/notifications" 
           hx-trigger="change"
           hx-target="#notification-settings">
    通知を有効にする
</div>

比較：POST（追加） vs PUT（置換）

POST

意味: 新しいものを作る。既存のものに何かを付け加える。
イメージ: 掲示板に「新しい投稿」を増やす。

PUT

意味: 既存のものを丸ごと入れ替える。
イメージ: すでにある「投稿」の本文を書き直して保存し直す。

※ 厳密なRESTの世界では、PUTは「全ての項目を送信する」ことが期待されます。「一部だけ変えたい」ときは、後に紹介するPATCHが最適です。

まとめ：初心者のための「更新」の整理術

PUTを使うと、あなたのアプリの「データの流れ」が劇的に整理されます。

名詞で通信先を考える: /update-profile という動詞のURLではなく、/profile/1 という「もの（リソース）」のURLに対してPUTを送るのが、美しいWebの作法です。
サーバーのコードがシンプルに: 「PUTが来た＝上書きすればいい」と決まっていれば、サーバー側のプログラムで複雑な分岐を書く必要がなくなります。
安全なリトライ: もしユーザーが連打したり、エラーで再送されたりしても、PUTなら「最新の状態になる」だけなので安心して任せられます。

古くなった情報を捨て、新しい姿に生まれ変わる。hx-put を使って、Webの本来の設計思想に基づいた、スマートな更新処理を実装してください。次の記事では、いらなくなったものを潔く消し去る「DELETE」（044. DELETE）の極意を学びます。