歷經了 30 天的不間斷挑戰,我們的「AI 智慧用藥監測系統」終於正式部署上線,順利迎來了完賽的這一刻!回顧這段旅程,我們從零開始,逐步將一個簡單的構想,打造成為一個具備完整功能、優良架構與絕佳使用者體驗的現代化網頁應用程式。
我們在這 30 天達成了什麼?
回顧我們的技術足跡,這是一個非常扎實的全端思維與前端實作訓練:
1.React 現代開發架構:捨棄了繁瑣的 Props Drilling,我們利用 Context API 打造了全局的狀態管理中樞,並在最後一天進階實作了 Custom Hook (useLocalStorage),將底層邏輯完美封裝,展現了高水準的程式碼潔癖。
2.無縫的 AI 賦能:成功串接 Google Gemini API,透過精準的 Prompt Engineering,讓 AI 成為具備臨床思維的專業藥師,能主動揪出潛在的藥物交互作用並給予衛教建議。
3.細膩的 UX/UI 體驗:從 Tailwind CSS 的響應式切版、SweetAlert2 的優雅防呆防錯機制,到滿分達標時灑下的 canvas-confetti 慶祝紙片。我們證明了醫療系統不需要總是生硬冷冰冰,它也可以非常有溫度且充滿互動性。
4.Vercel 雲端部署:將原本只存在於本機端 (localhost) 的程式碼,透過 GitHub 自動化 CI/CD 流程推送到全球 CDN,讓任何人都能透過網址實際使用我們的產品。
醫學資訊技術的落地價值
這 30 天的實作,正是結合醫療領域與軟體工程的完美實踐。在醫學資訊的發展中,我們最期盼的就是看到技術能真正落地,去解決現實世界的問題。
病患忘記吃藥、吃錯時間、或是忽略了藥物與食物的交互作用,這些都是臨床上常見的痛點。我們開發的這套系統,透過清晰的視覺進度條降低了記憶負擔,並用 AI 提供即時的客製化警語,這就是在用程式碼實質提升用藥安全與生活品質。
未來展望 (Future Work)
雖然鐵人賽結束了,但這個專案還有許多可以無限擴充的想像空間:
1.整合後端與資料庫:串接 Firebase 等 BaaS 服務,實作多裝置雲端同步與專屬會員登入功能。
2.PWA (Progressive Web App) 技術:讓網頁可以像真的 APP 一樣安裝在手機桌面,甚至實作推播通知 (Push Notifications) 準時提醒病患吃藥。
3.OCR 藥袋辨識整合:未來可結合影像辨識 API,讓長輩直接用手機拍下藥袋,系統自動帶入藥名與劑量,達到真正的無障礙輸入。
結語
完成這套系統只是一個起點,希望未來我們能持續運用技術,打造出更多有益的智慧健康應用。