iT邦幫忙

2026 iThome 鐵人賽

DAY 16
0

今天開始製作新的健康紀錄功能:

喝水紀錄

前面已經有基本的喝水功能,所以今天主要是把它整理成比較完整的每日喝水紀錄。


一、先確認原本的喝水功能

原本首頁已經可以:

  • 按下按鈕增加一杯水。
  • 更新喝水進度。
  • 喝到 8 杯時顯示達標訊息。

所以今天沒有重新製作,而是先請 Codex 檢查原本的程式,再進行需要的修改。


二、讓喝水紀錄每天獨立

今天希望喝水紀錄可以按照日期分開。

也就是:

昨天
💧 8 杯
↓
今天
💧 0 杯

而不是把昨天的喝水量直接帶到今天。
同時也要保留重新整理後資料還在的功能。


三、今天使用 Codex 的 Prompt

今天我用的 Prompt :
「目前 AI 保健小幫手首頁已經有喝水功能,可以按下按鈕增加一杯、更新進度條,並在達到 8 杯時顯示達標訊息。今天請將目前的喝水功能整理成完整的『每日喝水紀錄』功能。請保留目前已經正常的喝水按鈕、進度條與 8 杯達標提示,不要重新製作整個功能。請讓喝水杯數依照日期保存,每天開始時應該是新的喝水紀錄,不要直接沿用前一天的杯數。使用目前專案的 localStorage 資料保存方式,並確保重新整理後今天的喝水紀錄仍然存在。請先檢查目前程式架構,再進行必要修改。修改完成後請告訴我修改了哪些地方,以及建議我如何測試。」


四、實際測試

修改完後,我開始測試喝水紀錄。

我連續增加喝水杯數,確認:
✅ 杯數會正常增加
✅ 進度條會跟著更新
✅ 重新整理後紀錄仍然存在

接著喝到:
8 / 8 杯

確認:
✅ 進度條達到 100%。
✅ 顯示「今天已達喝水目標」。

最後也確認喝水紀錄會依照日期區分,不會直接把前一天的紀錄帶到今天。


五、今天的成果

今天主要完成了:
✅ 完整的喝水紀錄。
✅ 可以增加喝水杯數。
✅ 進度條會同步更新。
✅ 8 杯時會顯示達標。
✅ 重新整理後資料仍然存在。
✅ 每天的喝水紀錄可以獨立計算。

目前喝水功能變成:

喝水
 ↓
增加杯數
 ↓
更新進度條
 ↓
達到 8 杯
 ↓
顯示今日喝水目標已達成

Day 17|加入喝水提醒

目前喝水紀錄已經可以正常增加、保存,也可以顯示每天的喝水進度。

明天希望可以做到:

💧 記得喝水喔!

今天已喝 3 / 8 杯

[我喝了一杯]

讓喝水提醒可以和目前的喝水紀錄連在一起,按下「我喝了一杯」後就直接更新今天的喝水杯數。


上一篇
Day 15|修正每日服藥狀態:每天刷新
下一篇
Day 17|規劃喝水提醒功能
系列文
AI 保健小幫手:用 ChatGPT & Codex 打造個人健康紀錄工具 共 17 篇
圖片
  熱門推薦
圖片
{{ item.channelVendor }} | {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言