iT邦幫忙

2026 iThome 鐵人賽

DAY 28
0
ChatGPT & Codex

從 Prompt 到 Pull Request:30 天玩懂 ChatGPT & Codex系列 第 28 篇

# Day 28|開新 Branch、加新功能、發出 Pull Request

  • 分享至 

  • xImage
  •  

今天要替 Issue Tracker 加入「刪除任務」功能。從最新的 main 開一個新 branch、完成一項小功能、執行驗證,最後發出一張新的 Pull Request。

先定義今天的需求

刪除看起來只需要一個按鈕,但仍然有幾個行為需要先決定:

  • 每筆任務都顯示刪除按鈕
  • 點擊後要先顯示確認訊息
  • 使用者確認後才刪除
  • 使用者取消時資料保持不變
  • 刪除結果要同步保存到 localStorage
  • 在搜尋或篩選結果中刪除時,畫面要立即更新
  • 刪除最後一筆符合條件的任務後,要顯示正確的空狀態

今天不加入復原、垃圾桶、批次刪除或軟刪除。這些都可以成為未來的獨立需求。

從最新的 main 開始

建立新 branch 前,要先確認舊功能真的已經合併,而且工作區沒有未提交修改。

預計流程是:

git switch main
git pull --ff-only
git switch -c feature/delete-issue

git pull --ff-only 可以避免在更新 main 時意外產生 merge commit。如果工作區不乾淨、遠端更新失敗或 branch 已經存在,就應該先停下來確認,不要硬接著實作。

今天使用的 Prompt

我會在 Issue Tracker repository 開啟新的 Codex 任務,輸入:

請替目前的 Issue Tracker 新增「刪除任務」功能,並準備一張新的 Pull Request。

請先閱讀:
- README.md
- AGENTS.md
- package.json
- 目前任務的型別、狀態管理與 localStorage 邏輯
- 任務清單與單筆任務元件
- 現有測試
- `.github/workflows/ci.yml`

開始前請確認:
1. `feature/search-and-filter` 的內容已經存在於 main
2. 目前 working tree 沒有未提交變更
3. 本機 main 是否和遠端同步
4. 現有測試與 `npm run check` 可以執行

確認沒有阻擋問題後:
1. 從最新的 main 建立 `feature/delete-issue`
2. 為每筆任務加入容易辨識的刪除按鈕
3. 點擊刪除時先要求使用者確認
4. 只有確認後才刪除任務
5. 取消確認時不改變任何資料
6. 將刪除後的資料同步保存到 localStorage
7. 確保搜尋或狀態篩選啟用時,刪除後的畫面立即更新
8. 刪除最後一筆符合條件的任務後,顯示目前既有的正確空狀態
9. 補上成功刪除與取消刪除的測試
10. 執行相關測試與 `npm run check`

不做事項:
- 不加入復原、垃圾桶、軟刪除或批次刪除
- 不修改搜尋與狀態篩選規則
- 不重新設計整個畫面
- 不新增或升級套件
- 不進行與刪除功能無關的重構
- 不修改 GitHub Actions

請先提出最小實作計畫與預計修改的檔案,確認需求和現有程式沒有衝突後再開始修改。

實作完成後請回報:
- 實際修改的檔案與用途
- 各項需求對應的程式與測試證據
- 測試和 `npm run check` 的結果
- 實作與原計畫是否有差異
- 尚未完成或需要人工確認的事項
- 完整 diff 摘要
- 目前 branch 與 Git 狀態

先不要 commit、push 或建立 Pull Request,等我檢查結果。

這段 prompt 的回覆和執行

先驗收功能,不急著發 PR

Codex 完成後,先啟動專案並實際操作:

  1. 建立多筆任務
  2. 取消一次刪除,確認任務仍然存在
  3. 再次操作並確認刪除,確認任務立即消失
  4. 重新整理頁面,確認被刪除的任務沒有回來
  5. 開啟搜尋後刪除其中一筆結果
  6. 開啟狀態篩選後刪除其中一筆結果
  7. 刪除最後一筆符合條件的任務,確認空狀態正確

接著確認自動化驗證:

npm run check

不能只看到刪除按鈕就算完成。確認、取消、持久化以及篩選中的畫面更新,都是這次需求的一部分。

檢查完整 Diff

人工操作和測試通過後,再檢查 Codex 實際改了什麼:

git status --short
git diff --stat
git diff

建立 Commit

確認功能與 diff 都正確後,再建立一個能說明目的的 commit:

git add <這次確認過的檔案>
git commit -m "feat: add issue deletion"

這裡仍然使用明確的檔案路徑,不直接用 git add .,避免把其他檔案一起放進 commit。

Commit 完成後再確認一次:

git status
git show --stat --oneline HEAD

推送 Branch

接著把新的 branch 推送到 GitHub:

git push -u origin feature/delete-issue

推送後,GitHub 才能使用這個 branch 建立 Pull Request。

請 Codex 草擬 PR 說明

在同一個 Codex 任務中繼續輸入:

我已經檢查並提交目前的修改。

請比較 `main...HEAD` 的完整 diff,草擬一份可以直接貼到 GitHub 的 Pull Request 說明。

內容包含:
- 背景與目的
- 實際修改內容
- 人工測試步驟
- 自動化驗證結果
- 不做事項與已知限制
- Reviewer 應優先檢查的位置
- 操作畫面的預留位置

所有內容都必須能從目前 diff、測試或實際驗證結果證實。
不要加入未完成的功能,也不要編造截圖網址。
這次只產生 Markdown 文字,不要修改檔案或操作 GitHub。

這段 prompt 的回覆和執行

建立新的 Pull Request

確認 PR 草稿後,在 GitHub 選擇:

base: main
compare: feature/delete-issue

標題可以使用:

feat: add issue deletion

把確認過的說明貼入內容,補上實際操作畫面,再建立 Pull Request。

建立後要確認:

  • base 與 compare branch 正確
  • Files changed 只有這次刪除功能
  • commit 數量符合預期
  • GitHub Actions 已經開始執行
  • CI 最後顯示綠燈

https://ithelp.ithome.com.tw/upload/images/20261005/20183657mhGDno0kwb.png

今日小結

今天從最新的 main 建立 feature/delete-issue,讓 Codex 實作刪除任務、補上測試,並在人工驗收與 npm run check 通過後建立 commit。
最後把 branch 推送到 GitHub,根據實際 diff 整理說明並發出新的 Pull Request。從需求、branch、程式、測試到 PR。


上一篇
# Day 27|README 也能由 AI 寫
系列文
從 Prompt 到 Pull Request:30 天玩懂 ChatGPT & Codex 共 28 篇
圖片
  熱門推薦
圖片
{{ item.channelVendor }} | {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言