驗證姓名與 Email
修改檔案：script.js
完成後看見：畫面顯示姓名、Email 驗證結果，通過時仍明確標示尚未建立 payload
MOCK POST
聯絡我
尚未建立 payload
CHAPTER 23 · PRACTICE WORKSPACE
完成可驗證、提交並顯示結果的聯絡表單
TASK STATUS
修改檔案：script.js
完成後看見：畫面顯示姓名、Email 驗證結果，通過時仍明確標示尚未建立 payload
修改檔案：script.js
完成後看見：預覽區顯示 name、email、message，狀態為「payload 已建立；尚未送出」
修改檔案：script.js
完成後看見：成功與失敗都可重現，送出期間按鈕停用且完成後恢復
WORKSPACE
已完成 TASK-01；先核對可見結果，再前往 TASK-02。
FOCUS TASK · TASK-02
比較：畫面顯示 payload 只能證明資料已整理，尚未送出時不能顯示成功。
現在做：在 Checkpoint 2 填入姓名「小安」、Email xiaoan@example.com、訊息「我要詢問合作」後送出；核對 payload-preview 的三個 key、值與狀態，不勾選模擬失敗。
預期：preview 只包含 name、email、message 三個欄位，值與表單一致；status 是「payload 已建立；尚未送出」，沒有 loading 或成功編號。
證據：保存 JSON 預覽與 status 截圖，逐項圈出三個允許欄位，證明建立 payload 不等於已送出。
比較：預覽內容應從 createPayload 的結果產生，不要在畫面另寫一份可能不同步的文字。
現在做：保留姓名與 Email 不變，只把訊息改成「第二段訊息」後再次送出；比較兩次 preview，並檢查 JSON 是否仍只有三個既定欄位。
預期：preview 的 message 會跟著表單更新，name／email 保持原值，沒有把 checkbox 或其他 DOM 狀態混進 payload。
證據：留下兩次 JSON 預覽與欄位清單，證明畫面預覽來自同一個 createPayload()，而不是另寫一份不同步文字。
完成條件：DONE-02：預覽區顯示 name、email、message，狀態為「payload 已建立；尚未送出」
MOCK POST
尚未建立 payload
CONTINUE
前往 Checkpoint 2，依要求完成「建立尚未送出的 payload 預覽」。
CHAPTER HANDOFF
接收第 22 章：沿用已完成的產品列表與分頁邊界證據；本章不重做列表，改處理使用者輸入、驗證與提交生命週期。
交給第 24 章：完成後帶著驗證通過的 payload、loading／success／error 與 finally 恢復證據，下一章直接比較一次 POST 與持續訂閱，不重做表單驗證。
前往第 24 章：即時資料模型與 Firebase 介面