Finrod Chen
  • 作品
  • 文章
  • 關於
  • 好物
來信聊聊
Finrod Chen

白天在生醫產業做細胞治療,晚上寫 side project。這裡收網站、雲端、3D 列印、Arduino,以及一些工作上的紀錄。

網站

  • 作品
  • 文章
  • 關於
  • 好物

其它

  • GitHub
  • LinkedIn
  • 舊部落格
  • [email protected]
© 2026 Finrod Chen
  • GitHub
  • LinkedIn
  1. 作品
  2. Tool
  3. 居家防災包檢點

居家防災包檢點

一項一項檢點:勾選、秤重、看到期日,不用登入。

上線Tool2026
居家防災包檢點 的網站預覽

居家防災包的檢點工具:把家裡已經準備好的東西逐項建檔,標成已取得、評估中或暫不需要,再按背包分裝並盯住上限重量。會自動加總花費與總重、提醒 90 天內到期的品項,也能列印成紙本檢點表或用連結把清單分享到另一台裝置。整站是一份靜態 HTML,資料只存在使用者自己的瀏覽器。

防災包的難處不在「要準備什麼」,網路上的清單滿街都是;難的是準備完之後:罐頭什麼時候過期、水放到第幾年、這包揹起來到底幾公斤、上次檢查是什麼時候。清單印出來貼在櫃子上,三個月後就沒人動了。

所以這個工具不從「建議清單」出發,而是從「你家已經有的東西」出發:先把現有的物資一項一項加進來,填數量、重量、價格、到期日,再決定還缺什麼。缺的先列成評估中,當購物清單用,確定買了再改成已取得。

  • 三種狀態:已取得、評估中、暫不需要,各自分開統計,不會互相汙染數字
  • 背包分裝:每個背包設重量上限,即時顯示已裝多少、還剩多少,同一項分到多個背包時重量平均分攤
  • 到期提醒:90 天內到期的品項獨立一欄,換水換電池不用再靠記性
  • 本輪檢點:勾選式的檢查模式,可以只看還沒檢點的項目,下一輪再一鍵清除勾選
  • 列印版:輸出成紙本檢點表,貼在防災包旁邊給家人用

資料全部放在瀏覽器的 localStorage,沒有帳號、沒有後端。家裡有什麼、放在哪、值多少錢,這份清單本身就是一份居家財產與行蹤的側寫,不該為了同步而寄到別人的機器上。要換裝置就用「分享清單」,把整份清單編進一條連結自己傳給自己。

實作上刻意壓到一份靜態 HTML:樣式與邏輯都內嵌,沒有打包流程、沒有框架、沒有 service worker。好處是整站一次載入完就能離線操作,也沒有任何東西會在真的需要用到防災包的那天失效。

「防災包最常見的失敗不是沒準備,是準備完就忘了。」

基本資料

年份
2026
角色
Design + Build
狀態
上線
分類
Tool

技術

  • 單檔 HTML
  • Vanilla JS
  • localStorage
  • Cloudflare Pages
前往 bob.finrod.xyz(防災包清單)