在過去這半年,藉由 Claude 的大躍進,許多之前認為需要花很多時間才能完成的想法,就可以快速地落地實踐。
https://kiwi-walk.com/projects/
這篇系列文主要是以個人興趣所做的網站為出發點,結合我個人身為 Infra 工程師的角度與各種興趣的延伸,記錄我創造這些工具的心路歷程,將我個人在興趣上的認知 + 軟體工程的想法,都全部 DUMP 出來。
首先,先帶領目前手上的 Project
Coffee Review 是一個給自己用的咖啡評鑑工具,靈感來自 Cup of Excellence(CoE)的杯測 格式。它把「在家杯測一支豆子」與「在咖啡廳喝一杯」兩種情境收進同一套表單,讓我可以用 一致的方式記下每一次的味覺印象——香氣、風味、口感、總分,連同當下的筆記與風味輪選擇 一起保存下來。
總分是我自己決定的(74–96,先選獎牌級距再選分數),下面八項細評只是對照用,不拿來加總。店家不用手打,直接從 Google Places 搜尋選取,同一家店的氛圍、服務等印象另外記在「我的店家筆記」。它是這四個裡面最老的一個:2025 年 3 月開 repo,今年 5 到 8 月又陸續補上 Google 登入、表單草稿自動儲存、店家資料定期重新同步。
沒有 build step 的靜態前端丟 GitHub Pages,資料存在 Supabase 的 Postgres,每個專案一個獨立 schem
![]()
Commute 是一個記錄每天通勤的 PWA。畫面上只有一張「車票」按鈕,會依照現在是上班還是下班、有沒有正在搭的車,自動變成「上車」或「下車」,在手機上單手點一下就完成(第一版是上班/下班 × 上車/下車四顆按鈕,後來收成這一顆)。每次打卡都會自動帶上當下的時間與天氣,不必手動輸入;上車超過 40 分鐘還沒按下車,手機會收到推播提醒。資料累積起來之後,App 會畫成圖表,並依方向、星期、天氣給出車程的中位數與 P90 預測。
![]()
Daily 是一個刻意做得很小的每日追蹤器。它同時記兩種承諾:習慣(你要去做的事,例如 「讀 30 分鐘」「冥想」)與原則(你要守住的線,例如「不吃加糖」「吃飯不滑手機」)。 兩者用同一套打卡機制並排呈現,再用一張 GitHub 風格的完成度熱圖把你的堅持視覺化。
「小」是寫死的規則:同時最多 7 個項目、名稱不超過 10 個字、只有一種主色。熱圖依當天完成的百分比分成 7 個色階,全部打勾的日子會多一個小閃光;除了每個項目自己的連續天數,還有一個「Full Combo」算的是所有項目一起全勤的連續天數。它其實是重寫過的版本:2026 年 5 月底第一版叫 Pixie,是一個像素風、帶遊戲化的習慣與家事 RPG,做了一週多後整個砍掉,6 月初改寫成現在這個沒有任何遊戲化、只講持續的 Daily。
熱騰騰正在製作的
追蹤雙北美術館、畫廊的展覽
| Coffee Review | Commute | Daily | |
|---|---|---|---|
| 前端 | Vanilla JS 單檔 SPA + Bootstrap,無 build | ES module,一頁一個 HTML,無 build | React 18 + Vite |
| 部署 | GitHub Pages | GitHub Pages | GitHub Pages |
| 資料 | Supabase coffee schema |
Supabase commute schema |
Supabase public.dt_* 表 |
| 身分 | Google 登入 + RLS | RPC + bcrypt secret | Email 登入 + RLS |
| 其他 | Google Places、Vitest | Open-Meteo 天氣、pg_cron + Edge Function 推播 | Vitest + Playwright 三層測試 |