iT邦幫忙

鐵人檔案

2025 iThome 鐵人賽
回列表
自我挑戰組

打造一個糖尿病自我監測小工具:從0開始學前端 系列

本系列將紀錄我如何從零開始學習 HTML / CSS / JavaScript,並逐步打造一個糖尿病患者可用的健康監測網站。功能將包含血糖數值紀錄、是否異常的即時提示、以及簡單的生活建議提醒。希望透過這 30 天的學習與實作,不僅掌握 React + TypeScript + Tailwind CSS 等技術,也實際開發一個對糖尿病病患與家屬有幫助的小工具。

參賽天數 24 天 | 共 24 篇文章 | 1 人訂閱 訂閱系列文 RSS系列文
DAY 11

Day11打造一個糖尿病自我監測小工具:從0開始學前端

今天要了解如何填寫完表單後送出,會出現在 report.html 頁面中。因為目前還沒打算加入後端,所以先用 LocalStorage 這個功能代替。 什麼是L...

2025-09-11 ‧ 由 1155 分享
DAY 12

Day12打造一個糖尿病自我監測小工具:從0開始學前端

昨天 script.js的部分有點搞錯了,今天修正+實作。 script.js 添加部分 流程:取得表單資料 → 存入localStorage → 轉跳至 re...

2025-09-12 ‧ 由 1155 分享
DAY 13

Day13打造一個糖尿病自我監測小工具:從0開始學前端

今天先稍微處理了一些不順眼的地方: 將 report.html、record.html 兩個頁面加上標題 將 record.html 頁面添加標題欄,以便回主...

2025-09-13 ‧ 由 1155 分享
DAY 14

Day14打造一個糖尿病自我監測小工具:從0開始學前端

今天處理昨天提到的問題: 將 report.html、record.html 兩個頁面加上標題 將 record.html 頁面添加標題欄,以便回主頁或其他頁...

2025-09-14 ‧ 由 1155 分享
DAY 15

Day15打造一個糖尿病自我監測小工具:從0開始學前端

想到了兩個想做的新功能: 加上刪除功能 加上趨勢圖表 今天先了解程式碼,明天再實作。 刪除功能 思路 每一筆資料在 report.html 的表格 會有一...

2025-09-15 ‧ 由 1155 分享
DAY 16

Day16打造一個糖尿病自我監測小工具:從0開始學前端

昨天說要加上刪除功能與血糖圖表,想了想刪除功能應該在 record.html 不應該在 report.html ,所以刪除功能決定改成在填寫表單的最下面加入一個...

2025-09-16 ‧ 由 1155 分享
DAY 17

Day17打造一個糖尿病自我監測小工具:從0開始學前端

今天來挑戰使用者「帳密」的功能,因為這個是患者或家屬為個人的病情做紀錄,所以我認為應該要有帳密的功能。 想法 創建 signup.html 作為註冊頁面:輸入...

2025-09-17 ‧ 由 1155 分享
DAY 18

Day18打造一個糖尿病自我監測小工具:從0開始學前端

既然進入到了基礎帳號系統部分,我認為較完整的功能有這三個: 註冊 / 登入 / 登出 ( 昨天做了 ) 忘記密碼 / 修改密碼 個人資料管理(年齡、性別、病史...

2025-09-18 ‧ 由 1155 分享
DAY 19

Day19打造一個糖尿病自我監測小工具:從0開始學前端

今天重點放在個人資料頁面 pofile.html ,從帳號管理頁面,點擊「編輯個人資料」能轉跳到這,我打算這邊可以修改個人的詳細資料。 先整理一下想法: 在 ...

2025-09-19 ‧ 由 1155 分享
DAY 20

Day20打造一個糖尿病自我監測小工具:從0開始學前端

今天放上昨天實作的東西,真的弄超久...,一直被 JS 邏輯卡住。 成果呈現 ( 修改前 ) 詳細個人資料:按下「編輯個人資料」轉跳 編輯個人資料頁面:...

2025-09-20 ‧ 由 1155 分享