鐵人檔案
這次挑戰將從過去學習過的 JavaScript 與 Vue 經驗出發，重新認識 React 與 TypeScript 的核心概念與開發方式。前期會著重比較新舊技術之間的差異，後期則實際導入 AI 協作，讓 AI 負責產出程式碼，而我負責閱讀、拆解、理解與 Code Review。
比起單純追求「用 AI 完成一個專案」，希望透過這 30 天探索：當 AI 已經能夠協助寫程式時，身為開發者的我們應該理解什麼、判斷什麼，又該如何真正把 AI 產出的 Code 變成自己看得懂的程式碼。
一個畫面變成多個檔案 上一篇將漫畫與動畫收藏清單的需求交給 AI 後，它沒有把所有程式碼都寫在 App.tsx，而是拆成了好幾個 Component： App...
Component 拆開後，資料放在哪裡 今天再繼續往下看，了解收藏資料到底該放在哪個 Component。 目前主要的收藏資料放在 App.tsx： cons...
從輸入框開始跟著資料走 上一篇順著 items 看了一次資料如何在 Component 之間傳遞。今天則把範圍縮小到 AddItemForm.tsx，看看從輸入...
關掉網頁後資料還在 React State 本身不會負責在重新整理或關閉網頁後保留資料。當網頁重新開啟，Component 會再次建立，State 也會重新取得...
檢查 AI 的程式碼 前面幾天順著 Component、資料流、表單與 localStorage，慢慢理解 AI 產生的專案。目前主要功能都可以正常使用： 新...
把 Day 25 發現的問題整理清楚 上一篇進行 Code Review 時，發現 loadItems() 雖然標示會回傳 CollectionEntry[]，...
AI 改完不代表可以直接接受 Day 25 透過 Code Review 發現 loadItems() 沒有檢查資料格式，Day 26 則把問題整理成明確需求，...
問 AI 的方式改變了 這個系列一開始設定的方向，是下指令讓 AI 負責產出程式碼，而自己負責閱讀、拆解、理解與 Code Review。Day 20 剛開始建...
回想一開始的印象 還記得最一開始看到 React 時，最直接的感覺就是：「怎麼很多東西都直接寫進 JavaScript 裡？」Vue 中熟悉的 v-for、v-...
這篇，讓我們回到最初的起點 夢回Day 1(？)程式碼都讓 AI 寫，那我到底要學什麼？對第一次接觸 React 與 TypeScript 的我來說，語法與觀念...
