用 Codex，手把手做出婚禮網站

「幫我做一個浪漫婚禮網站」太模糊，每個人想像的浪漫都不同。先告訴 Codex 網站給誰看、一定要有哪些內容、你喜歡什麼風格，以及哪些事情這次不要動。OpenAI 官方文件也建議，以成果、限制與完成條件描述任務，不必先替 Codex 規定每一個技術步驟。

目標：製作一個給 [新人名字] 使用的婚禮網站。
受眾：[婚宴賓客／海外親友／只看手機的使用者]。
必要內容：[日期、地點、交通、流程、相簿、RSVP]。
視覺方向：[三個形容詞]，參考 [圖片或網站]。
素材位置：[照片資料夾、文案文件、Logo]。
技術現況：[既有框架、可用指令、瀏覽器需求]。
完成條件：[手機可讀、表單可送、所有連結可用、測試通過]。
界線：先不要 [部署／改後端／更換既有登入／提交 Git]。

先不要急著改程式。請 Codex 找出網站入口、樣式、圖片、表單和測試方式，再用白話整理目前狀況。這能避免重做已經存在的功能，也能提早發現圖片太大、表單尚未真的送出，或私人文件可能被公開等問題。

先不要修改程式。請盤點這個婚禮網站：
1. 找出頁面入口、CSS、JavaScript、圖片與建置指令。
2. 說明目前版型、互動、表單與響應式狀態。
3. 找出缺少素材、失效連結、效能與可及性風險。
4. 讀取專案規則與文件，整理成可驗證的實作清單。
5. 明確列出哪些事情需要我決定，其他可合理推進。

如果專案有固定規則，例如「所有指令都要透過 Docker 執行」或「不要自動部署」，可以寫在 AGENTS.md。Codex 會依工作位置讀取適用的規則；越接近目前檔案的規則，優先順序越高。

可以把 Skill 想成給 Codex 使用的「工作手冊」。它會把固定指示、參考資料和檢查工具放在一起，讓設計、圖片、文字或驗收工作每次都依相近標準進行。你不需要自己理解 Skill 裡的所有技術細節。

$impeccable
請延續現有婚禮品牌，設計首頁、故事、活動資訊與 RSVP。
視覺要有 [編輯感／溫暖紙張／克制動畫]，不要使用通用 SaaS 卡片風格。
先確認資訊層級與手機閱讀順序，再實作。
保留現有內容與功能；完成後檢查對比、焦點、空白與錯誤狀態。

不要同時要求十個頁面全部完成。先做一條從首頁一路走到 RSVP 成功送出的流程，確認真的可用，再加入更多內容。本案例先完成一個公開婚禮模板，再讓同一套表單可用於 GitHub Pages 或自訂網域。

1. 先完成內容結構、導航與手機版閱讀順序。
2. 整理圖片尺寸、替代文字與載入策略。
3. 完成 RSVP 欄位、送出中、成功與失敗狀態。
4. 再串接後端表單服務；公開金鑰與允許來源分開管理。
5. 最後才處理後台查看、搜尋與 CSV 匯出。

開始實作第一個可用版本：
- 保留現有視覺素材與文案。
- 完成首頁到 RSVP 送出的完整流程。
- 靜態展示與表單 API 分離，預留不同網域來源。
- 每次修改後執行既有檢查與建置。
- 不要提交或部署；把待確認事項寫進文件。
完成後告訴我：改了什麼、如何驗證、還有哪些限制。

賓客多半用手機開啟婚禮網站，也可能在網路不穩時填寫。完成後要真的點過導覽、開過圖片並送出測試表單，不能只看首頁截圖覺得漂亮就結束。

• 手機沒有橫向溢出，導覽不遮住標題與按鈕。
• 圖片有合理尺寸、替代文字，慢速載入不破版。
• 所有錨點、外部連結、地圖與行事曆操作可用。
• 表單有必填驗證、送出中、成功、錯誤與重試說明。
• 鍵盤焦點清楚，文字和按鈕對比足夠。
• 金鑰未寫進私有文件；公開金鑰沒有被誤稱為密碼。
• 既有測試、語法檢查與正式建置全部通過。

請做最後驗收，不要只摘要程式碼：
1. 在桌面與手機尺寸檢查主要流程。
2. 實際測試 RSVP 成功、驗證失敗與網路錯誤。
3. 執行專案測試、語法檢查與正式建置。
4. 檢查 Git 狀態，確認私有文件和金鑰沒有被追蹤。
5. 以「已通過／未通過／尚未涵蓋」回報，附上可重現證據。

完成後至少留下兩份說明。公開 README 讓其他人知道專案用途、預覽方式和基本操作；私人文件記錄主機、帳號、正式設定和後續工作。不要把這兩類內容混在一起，更不要把密碼或私人資料放進公開 GitHub。

如果同一套流程之後還會用在其他新人網站，就可以再整理成 Skill。把要準備的資料、工作步驟和完成檢查寫清楚，下次換名字、照片和風格時，仍能沿用同一套品質標準。