← 所有標籤

#Next.js(4)

重構筆記//20 min

AI 時代的重構姿勢:OpenSpec × Claude Code 實戰 Ep-6

phase-3-jobs 把第四個行為角色 worker 接進來:`saving` listener 之外再加一個 `saved` listener 做 cross-table 副作用、apply 中途把 `WorkerJob.rejected` 從 spec 砍掉、multipart 上傳的 FormRequest 紅線。最痛快的一段是抓到一個 phase-1 就埋下的 latent bug — server-side `fetch()` 沒帶 `Referer` 害 Sanctum stateful middleware 不認得 SPA session,整個 SSR 認證鏈靜默斷掉,直到 phase-3 因為新增的 `getApplicationStatusFromCookies` 把它逼出來。19 個 backend e2e + 13 個 frontend e2e + 133 個 Pest 一次過。

#重構筆記#OpenSpec#Laravel#Next.js#Sanctum#Multipart
重構筆記//15 min

AI 時代的重構姿勢:OpenSpec × Claude Code 實戰 Ep-5

phase-2-carbon-listings 一天從 propose 跑到 archive。10 個 design 決策挑 4 個講透:**角色推導用 row 存在性而不是 enum**、**state machine + saving listener 雙保險**、**同時購買的競態用 DB::transaction + lockForUpdate + UNIQUE 三層防線**、**`/me` 不開新端點直接 spread role flag**。69 個 Pest 測試怎麼被 8 個 task group 推著長出來,前端 8 個 surface 怎麼用一個 `serverGet` helper 把 RSC + cookie 接住。最後 archive 儀式:delta spec sync 回 `specs/auth` + 整本 `specs/carbon-listings` 落地。

#重構筆記#OpenSpec#Laravel#Next.js#State Machine
重構筆記//12 min

AI 時代的重構姿勢:OpenSpec × Claude Code 實戰 Ep-4

phase-1-auth-sanctum 開工。/opsx:propose 一條指令背後 4 個 artifact 各在做什麼、Sanctum SPA 模式為什麼比 token 模式適合 Carbon-ESG、`SESSION_DOMAIN` / `SANCTUM_STATEFUL_DOMAINS` / `cors.php` / `withCredentials` 四個觸點為什麼被寫進 spec 級別 requirement、以及 Next.js 16 App Router 上 `useSession()` 怎麼設計成 SSR-friendly 的雙形態 hook。本篇純設計 walkthrough,實作 transcript + Network panel debug clinic 留 Ep-5。

#重構筆記#OpenSpec#Laravel#Sanctum#Next.js
重構筆記//24 min

AI 時代的重構姿勢:OpenSpec × Claude Code 實戰 Ep-3

Carbon-ESG 前端開工。本篇拆解 `pnpm create next-app` 那一行指令背後的 8 個 flag、pnpm 11 的 onlyBuiltDependencies 為什麼會卡住 sharp/unrs-resolver、Node 24 上的 .nvmrc 怎麼降版、以及把預設 starter 替換成「14 行能看到後端 API URL」的最小首頁。最後用一個 axios client 先預告 Sanctum SPA 模式的 cookie 契約,完整對接留到 Ep-4 拆。

#重構筆記#OpenSpec#Next.js#React