iT邦幫忙

鐵人檔案

2026 iThome 鐵人賽
回列表
Software Development

當 AI 會寫 Code 之後:前端工程師的 30 天 SA/SD 學習筆記 系列

當 AI 越來越會寫程式,我開始思考:身為前端工程師,自己還需要練習哪些能力?
這 30 天想記錄學習系統分析與設計(SA/SD)的過程。
從「加個按鈕」這樣的小需求出發,練習拆解問題、釐清狀態與資料責任,再把想法整理成 Prompt,以及能重複使用的 AI Skill。
這是一份邊學邊寫的筆記,會透過前端情境與小型電商案例,留下自己的理解、疑問和修正。
希望在與 AI 協作的過程中,慢慢養成先想清楚、再動手寫的習慣。

參賽天數 10 天 | 共 17 篇文章 | 0 人訂閱 訂閱系列文 RSS系列文
DAY 10

Day 11|狀態機思維:控制複雜表單,也約束 AI 的實作

結果連假出去玩一個太開心,忘記有鐵人賽這件事情了不過沒關係,還是會持續寫完整。這邊也祝讀者們中秋節快樂!! 先記住:用合法狀態與事件取代互相矛盾的布林值。需要...

2026-09-27 ‧ 由 lunausemail 分享
DAY 10

Day 12|從 User Story 到 API Specification:前端主動參與介面設計

先記住:User Story 描述價值,API 還要對齊資料、錯誤與副作用。需要深入時:再寫 OpenAPI。 User Story 說明目的,還沒說清楚協...

2026-09-28 ‧ 由 lunausemail 分享
DAY 10

Day 13|用 AI 做競品分析與技術選型:先分清證據與推測

先記住:競品分析分開證據、推論與未知。需要深入時:再做 ADR 與驗證實驗。 「這個網站很快,應該是用了某個框架吧?」 假設我們觀察一個購物網站,頁面切換流...

2026-09-30 ‧ 由 lunausemail 分享
DAY 10

Day 14|週小結:用 AI 生成 PRD 與 User Story 的來源準確度

先記住:AI 產出的 PRD 是草案,決策仍要有來源與人確認。需要深入時:再建立追溯關係。 十分鐘生出 PRD,為什麼還是沒人敢開工? 進入AI 的時代之後...

2026-09-30 ‧ 由 lunausemail 分享
DAY 10

Day 15|AI 程式像一團線?從單一職責與模組化開始~

先記住:依變更原因分責任,不要只依行數拆檔。需要深入時:再做模組邊界設計。 一個改金額格式的需求,竟然碰到付款邏輯 假設購物車元件有六百行:抓資料、算折扣、...

2026-10-04 ‧ 由 lunausemail 分享
DAY 10

Day 16|焦點實戰:當 AI 寫出難維護的程式,如何用 SOLID 引導重構?

先記住:SOLID 用來解決具體變更風險,不是湊原則。需要深入時:再做介面與依賴重構。 「遵守 SOLID」之後,怎麼多了十個檔案? 假設 AI 把購物車整...

2026-10-05 ‧ 由 lunausemail 分享
DAY 10

Day 17|高內聚、低耦合:先別把所有邏輯塞進 Vue SFC

先記住:高內聚是一起變,低耦合是合作靠小介面。需要深入時:再畫依賴圖。 拆成十個檔案,還是每次都一起改 假設購物車被拆開了,但優惠模組直接修改商品 stor...

2026-10-05 ‧ 由 lunausemail 分享