昨天把頁面架構都建立起來了，
但目前的內容實際上來說，就是單純的靜態資料頁面，
使用的內容只是單純為了確定邏輯是否正確而已。
那既然決定不採用資料庫，
那「資料放哪、長什麼樣、怎麼保證不出錯」就得用另一套方法解決。
那就是今天最重要的關鍵~
data/ 靜態 JSON 的檔案清單與結構整個工具的資料只有兩個家：
data/（隨站部署・唯讀）
五個靜態 JSON，全部在開發期產好
| 檔案 | 內容 | 來源與更新 |
|---|---|---|
| industry_output.json | 產業產值時序 | 經濟部統計處，每季預抓（Day 4 的 parse-data.mjs 產出） |
| financials.json | 上市櫃營收・毛利 | MOPS，每季預抓 |
| classification.json | 行業分類 × 關鍵字 × 同義詞 × 權重 | 開發期用 Claude 建置（Day 8 主角） |
| io_table.json | 產業關聯表 | 主計總處，約 5 年一版 |
| templates.json | 儀表板解讀文字模板 | 開發期用 Claude 撰寫（情境 × 數值區間） |
每一檔都強制帶 meta 欄位：來源、抓取日期、基準期間、單位——資料自己說明自己的出處，Dashboard 的資料基準期區塊直接從這裡讀。
localStorage（使用者裝置・可寫）——評估紀錄存在訪客自己的瀏覽器：key 定為 records:v1，值是評估紀錄陣列（時間、產業、所選模型、輸入假設、結果摘要），上限 50 筆、超過淘汰最舊。免登入、免資料庫、零成本。
依照這份資料層設計（前面的圖），
- 定義 types/data.ts——五個 JSON 檔與 localStorage 紀錄的完整 TypeScript 型別，meta 欄位為必填
- 寫一個 lib/data.ts 載入模組：fetch 站內 JSON、驗證必要欄位、缺漏就丟出明確錯誤
) 寫 lib/records.ts：localStorage 的存取封裝，含 50 筆上限、版本 key、以及 try-catch（無痕模式下 localStorage 可能不可用）
接下來將依照Claude提供的 安裝與驗證說明一步步地進行
整體來說，驗收結果一次到位，
因為過去的經驗了解到，
AI在製作一工具或是一網站的平台時，
很容易會出現無痕模式無法儲存紀錄之情況
因此特別需要驗證此部分
而localStorage 的限制主要在於換裝置或清瀏覽器資料，紀錄就消失
因此在此工具上主要會增加「匯出紀錄 JSON」按鈕讓使用者自己備份，
避免使用者用完之後會抱怨
當然我覺得這是因為我這次把整個專案拆分得很細
所以才有辦法一次次地校正
如若是一般在做專案的情況下
沒有相關經驗之前提
極易忽略此部分可能存在的問題
當然我覺得通常在製作一個專案來說
我還是會將之鏈結到資料庫底下去執行
所以正常來說是不會有這個問題存在
今天整體來說
我目前為了要整套維持零資料庫、零執行期成本
因此讓Supabase 留在選配清單裡
如我之後我真的需要跨裝置紀錄，資料層介面不動、只換底層
我認為這可能是一個很明智的做法
當然我覺得因為這個專案較特別
我不想要未來出現不預期的成本支出
雖然這部分可能還會調整
但目前來說這是我滿意的情況~
iThome鐵人賽
看影片追技術