開始前，先準備三件事
編輯器、瀏覽器與自己的工作資料夾
- **Cursor 免費版：**開啟自己的資料夾，使用內建 AI 對話協助開發，再查看差異、儲存並檢查。使用帳號當下可用的功能，不要求付費訂閱。
- **瀏覽器：**用來開啟 index.html，看儲存後的結果。可以使用自己電腦上既有的瀏覽器。
- **student-work：**自己建立的練習資料夾。不要直接改下載的教材原件或其他專案。
主要使用 Cursor 內建 AI，ChatGPT 免費版作為 Cursor AI 無法使用時的備援。不要把帳密、真實個資或密鑰貼到對話中。
練習檔怎麼放
在第 1 堂第 1 步下載練習檔並解壓縮。找到裡面的 portfolio，整個複製到自己建立的 student-work。
student-work/
├── portfolio/ 自己要修改的正常作品
├── evidence/ 修改前後、畫面與檢查紀錄
└── fault-L01/ 除錯練習另放副本
若解壓縮工具多產生一層資料夾，繼續往裡面找到 portfolio，再複製它。不要只複製 index.html 而漏掉 styles.css 或 assets。
跟著六個步驟進行
每堂分成三輪理解與操作。依序看目標、準備檔案、跟著做，再檢查結果。Prompt 放在需要使用的步驟旁，先準備好輸入再複製。
「對照結果」會另開分頁。它能協助比較，但請先親手操作；看過完成版不等於自己的作品已完成。
自己確認後，可以勾選「我已完成這一步」。勾選只記在這個瀏覽器，並非成績或自動驗收；換瀏覽器、裝置或清除資料後不一定還在。不支援儲存時，仍能繼續閱讀與操作。
每份 Prompt 怎麼用
- 先看該份 Prompt 上方的「附上這些檔案與資料」，準備自己的最新版。
- 在 Cursor 開啟正確的練習資料夾，進入內建 AI 對話輸入框。輸入
@並從建議中選取指定檔案，確認完整路徑；兩個同名 index.html 要分清楚來源與候選副本。 - 把實際檔案清單、錯誤現象或發布指南文字一起貼上，再貼完整 Prompt。只寫路徑不等於已附上內容。
- 依「預期回覆與操作」進行：程式任務可由可用的 Agent 協助修改，先查看差異再儲存；檢查表任務要求只回覆文字，不修改檔案。
- 自己實際操作網站，完成「自己檢查結果」的條件後再勾選。AI 說完成，不等於網站已通過檢查。
如果 Cursor 只回覆程式碼，先核對檔名與修改位置，再存回自己的檔案；不要把 Prompt 或程式碼框的反引號貼進 HTML／CSS。
Cursor AI 無法使用時
在 ChatGPT 對話貼上相同的檔案內容、補充資料與 Prompt。檔案需重新提供，ChatGPT 不會自動讀取 Cursor 的專案。回覆由自己手動存回，之後執行同一套檢查；只要檢查表的任務仍只取得清單，不改網站。
Cursor 的介面與帳號可用功能可能不同，不要求固定模式名稱或保證免費次數；額度以帳號顯示為準。附檔方式可參考 Cursor 官方 Prompt 說明。
沒看到更新時
先確認有儲存，再看瀏覽器是否開到自己這份檔案，最後重新整理。若本機開檔受限，可以使用課堂提供的預覽方式，不需要在第一堂安裝額外開發工具。
AI 額度不足時，先閱讀既有回覆、檢查差異與親手修改；需要對照時使用當步提供的結果。把未做的 AI 操作記下來，恢復可用後再補練，不把看範例當成自己的生成結果。