CHAPTER 14 · PRACTICE WORKSPACE

Git、GitHub、README 與版本交付

具備清楚 README、可檢查 commit history 與可核對遠端版本的作品 repo

03 Checkpoint 2 2/3
  1. 01Starter讀懂作品骨架
  2. 02Checkpoint 1加入第一項能力
  3. 03Checkpoint 2累積第二項能力
  4. 04Solution核對完整結果

TASK STATUS

三項任務目前狀態

TASK-01已完成

寫清楚作品用途與目標讀者

修改檔案：README.md

完成後看見：README 說明作品用途，第一筆 commit 只包含作品骨架與定位，git status --short 顯示乾淨

TASK-02已完成

列出真實功能與本機開啟方式

修改檔案：README.md

完成後看見：陌生人能依 README 開啟作品，第二筆 commit 只處理功能與開啟方式，且 git status --short 顯示乾淨

TASK-03本階段處理

記錄排錯流程並驗證 commit 切分

修改檔案：README.md

完成後看見：排錯紀錄可重現，git log 顯示三筆範圍清楚且可說明的 commit，git status --short 顯示乾淨

WORKSPACE

本階段實作區

已完成 TASK-02；先核對可見結果，再前往 TASK-03。

FOCUS TASK · TASK-03

現在只處理：記錄排錯流程並驗證 commit 切分

修改：README.md

完成後：排錯紀錄可重現，git log 顯示三筆範圍清楚且可說明的 commit，git status --short 顯示乾淨

講解時展開：2 個小型比較

排錯紀錄 vs git history｜兩種證據

比較：README 留下可重現的排錯路徑，git log 留下版本切分；兩者互補而不是互相取代。

現在做：先在「排錯與版本證據」與 git log --oneline -3 做一次最小對照：只改這個責任並重新整理／操作，接著依「完成可重現的排錯紀錄後，執行 git add README.md、git commit -m "記錄 Git 排錯流程"、git log --oneline -3 與 git status --short，逐筆說明三個 commit 各自只完成哪一段交付。」重跑，記下前後差異。

看預期與證據

預期：完成後能觀察到「排錯紀錄可重現，git log 顯示三筆範圍清楚且可說明的 commit，git status --short 顯示乾淨」，並說出 README 留下可重現的排錯路徑，git log 留下版本切分；兩者互補而不是互相取代。

證據：用前後截圖或口述比較「排錯紀錄可重現，git log 顯示三筆範圍清楚且可說明的 commit，git status --short 顯示乾淨」，指出這個小型實驗如何證明 README 留下可重現的排錯路徑，git log 留下版本切分；兩者互補而不是互相取代。

有意義 commit vs 雜訊提交｜回顧要看得懂

比較：提交訊息與修改內容要能一起說明演進，不能只用 save、update 等無法驗證的名稱。

現在做：先在「排錯與版本證據」與 git log --oneline -3 做一次最小對照：只改這個責任並重新整理／操作，接著依「完成可重現的排錯紀錄後，執行 git add README.md、git commit -m "記錄 Git 排錯流程"、git log --oneline -3 與 git status --short，逐筆說明三個 commit 各自只完成哪一段交付。」重跑，記下前後差異。

看預期與證據

預期：完成後能觀察到「排錯紀錄可重現，git log 顯示三筆範圍清楚且可說明的 commit，git status --short 顯示乾淨」，並說出提交訊息與修改內容要能一起說明演進，不能只用 save、update 等無法驗證的名稱。

證據：用前後截圖或口述比較「排錯紀錄可重現，git log 顯示三筆範圍清楚且可說明的 commit，git status --short 顯示乾淨」，指出這個小型實驗如何證明提交訊息與修改內容要能一起說明演進，不能只用 save、update 等無法驗證的名稱。

需要排錯時查看：任務循環（觀察 → 預測 → 實作 → 故障 → 驗收）
  1. A｜觀察：留在教材 repo 外的個人練習資料夾，先用 git status 確認只有排錯紀錄尚未提交。
  2. B｜預測：完成可重現的排錯紀錄後，執行 git add README.md、git commit -m "記錄 Git 排錯流程"、git log --oneline -3 與 git status --short，逐筆說明三個 commit 各自只完成哪一段交付。
  3. C｜實作：在 README.md 的 「排錯與版本證據」與 git log --oneline -3 完成「記錄排錯流程並驗證 commit 切分」，一次只處理本任務責任。
  4. D｜故障：若結果不一致，先依原操作重現，再檢查 「排錯與版本證據」與 git log --oneline -3 與 README.md，最後重跑原操作。
  5. E｜驗收：排錯紀錄可重現，git log 顯示三筆範圍清楚且可說明的 commit，git status --short 顯示乾淨

完成條件：DONE-03：排錯紀錄可重現，git log 顯示三筆範圍清楚且可說明的 commit，git status --short 顯示乾淨

VERSION DELIVERY LAB

Git 到 GitHub 交付板

  1. 工作目錄確認路徑與修改
  2. 暫存區git add 後用 status 驗證
  3. 本機版本git commit 建立快照
  4. 遠端倉庫git push 後到 GitHub 檢查
查看本階段 README 靜態對照

README.html 是靜態對照，不會隨 README.md 編輯同步；請用 VS Code Markdown Preview 驗證自己的修改。

CHAPTER HANDOFF

第 13 章 → 第 14 章 → 第 15 章

接收：沿用第 13 章已驗證的 index.html、style.css 與回歸證據；本章只在教材 repo 外的個人資料夾建立 README 與 Git 版本證據。

交給第 15 章：保留同一份 index.html、style.css、README 與三筆可說明的 history；下一章直接新增 script.js 與 DOM 事件，不重做本章骨架。

CONTINUE

繼續完成 TASK-03

前往 Solution，依要求完成「記錄排錯流程並驗證 commit 切分」。

前往 Solution：完成 TASK-03