iT邦幫忙

2026 iThome 鐵人賽

DAY 1
0
Vibe Coding

今晚來點 Vibe Coding:用 BDD 驗收小明的約會外掛系列 第 1

Day 01 -「渣女 AI」很好笑,但它到底要做什麼?

  • 分享至 

  • xImage
  •  

今晚來點 Vibe Coding:用 BDD 驗收小明的約會外掛

https://ithelp.ithome.com.tw/upload/images/20260915/20124462jFM6iCS7O1.png

Day 01 -「渣女 AI」很好笑,但它到底要做什麼?

小明今晚沒有先叫 AI 寫畫面。他得先把一句玩笑,變成可以驗收的產品定義。

今日小明翻車紀錄 #01

小敏:「你不是說要找一間安靜、有自然光的咖啡店嗎?」

小明:「有啊,這間最近很紅,大家都說氣氛很好。」

小敏看了一眼門口排隊的人潮,又看了一眼店內正在辦活動的音響。

小敏:「你是不是只記得咖啡店,忘了前面那兩個條件?」

小明翻出聊天紀錄,才發現自己真的只記住了名詞,沒記住偏好。他還順手打開行事曆,發現兩小時後另有一個早就答應的行程。

朋友聽完他的災情,只留下一句評語:「你需要的不是更好的記性,是一套約會管理系統。」

小明回家後打開 AI:

小明:「幫我做一套渣女 AI。」

AI 很快列出聊天機器人、自動傳訊息、配對推薦、Google Calendar 同步、餐廳訂位和付費訂閱,甚至開始規劃原生 App。

小明:「等一下,我只是想不要再記錯。」

第一天的翻車就此完成:小明不只沒有定義清楚約會,連產品也沒有定義清楚。

一句玩笑,不能直接拿來當規格

「渣女 AI」只是一個好記的名字,不是能交給 AI 的規格。小明真正要解決的是多工關係的記憶負荷。
AI 可以靠創意生成各種產品,但在加速寫程式之前,必須先確立三件事:使用者痛點、v0.1 的最小交付範圍,以及明確不做清單。

小明的麻煩,不只是忘記名字

回頭拆解這場混亂,小明發現 DateOS 要處理的是散落各處的關係脈絡。
他也許記得一個人的名字,卻可能忘了對方的喜好、上次聊到哪裡、答應過什麼,甚至安排了互相衝突的時間。

小明需要的「約會外掛」因此被收斂成一條五步流程:

  1. 建立 Relationship。
  2. 補充偏好、備註與互動紀錄。
  3. 從 Dashboard 找出今天的行程與待跟進對象。
  4. 建立約會,並在寫入前檢查時間衝突。
  5. 使用已儲存的 context 取得 AI 建議。

這套產品定義記錄在 docs/product/product-brief.md,v0.1 的範圍則以 docs/product/scope-v0.1.md 為唯一依據。往後每一次 Vibe Coding,都必須能回到這兩份文件判斷功能是否該做。

為什麼還需要 BDD

Vibe Coding 適合快速刻出原型,但也容易讓需求變形。所以小明引入了 BDD:先用 Given、When、Then 定義情境,再透過測試與操作驗證結果。 分工很明確:Vibe Coding 負責加速探索,BDD 負責定義終點。

先替 AI 畫出邊界

AI 負責加速實作,產品邊界由人決定。

讓開發基線真的能重現

把套件管理統一為 Bun,並在 workspace 鎖定 Node 22:

https://ithelp.ithome.com.tw/upload/images/20260915/20124462RDinXeM41z.png

先替 AI 畫出邊界

這是小明在第一天建立的第一條 Vibe Coding 原則:
AI 可以加速實作,產品邊界仍要由人做出可檢查的決定。

讓開發基線真的能重現

產品定義完成後,小明檢查了 repository 的實際狀態。
專案雖然宣告使用 Bun,web workspace 的 scripts 原本仍呼叫 npm exec
把套件管理與執行入口統一回 Bun,並在 workspace 鎖定 Node 22 runtime:

{
  "scripts": {
    "typecheck": "node node_modules/nuxt/bin/nuxt.mjs typecheck",
    "test": "vitest run --passWithNoTests"
  },
  "devDependencies": {
    "node": "22"
  }
}

小明新增了 project-baseline.test.ts,讓 Vitest 自動檢查 Bun 與 scripts 的不變條件,防止日後回歸。

今晚踩到的坑

① 執行 bun install --frozen-lockfile 時遭遇 sandbox 暫存目錄權限問題,取得權限後解決。 ② 舊版 Node 無法執行 Nuxt typecheck,改將 node@22 加入 workspace devDependency,由 Bun lockfile 固定版本。 環境設定必須寫進專案,才能確保跨機器的穩定重現。

怎麼驗收今晚的成果

執行指令:

bun install --frozen-lockfile
bunx turbo typecheck --force
bunx turbo lint --force
bunx turbo test --force
bun run build

驗收結果如下:

  • TypeScript/Nuxt typecheck:通過,未使用 Turbo cache。
  • ESLint:通過,未使用 Turbo cache。
  • Vitest:1 個 test file、2 個 tests 全部通過。
  • Nuxt production build:client 與 Nitro server build 通過。
  • Playwright:當天還沒有使用者互動流程,因此不適用;核心 UI 出現後再納入驗收。

小明今晚完成了什麼

沒有華麗首頁,但有了可驗收的起跑線:產品問題、v0.1 範圍、架構方向、Bun 安裝方式與自動化檢查。先定義完成的標準,再讓 AI 加速實作。


系列文
今晚來點 Vibe Coding:用 BDD 驗收小明的約會外掛1
圖片
  熱門推薦
圖片
{{ item.channelVendor }} | {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言