disorders-of-Iron-metabolism-and-heme-synthesis：鐵代謝與血基質合成疾患的互動式教學專案

Thu, 09 Apr 2026 00:00:00 +0000

# Introduction（引言）

鐵代謝與血基質（heme）合成相關疾患涵蓋從缺鐵性貧血到 sideroblastic anemia、porphyrias 等多重診斷，其疾病機制橫跨腸道吸收、巨噬細胞回收、骨髓利用與肝臟調節，是血液內科教學的難點之一。傳統 PowerPoint 投影片難以呈現多步驟代謝路徑與多回饋環，常使學員陷入「單一概念能背、整體流程不通」的困境。本專案以互動式網頁形式呈現相關疾病，幫助學員建立完整概念地圖。

# Methods（方法）

實作以 Vue 為前端框架，著重於互動效果：使用者可點擊代謝路徑上的節點查看相關酵素、回饋環與致病突變；可切換至特定疾病視圖，觀察該疾病在路徑上的位置與下游效應。資料層採用結構化 JSON，使路徑與疾病知識可獨立維護，便於後續更新與多語言支援。

設計重點為「以結構代替記憶」：透過視覺化與互動，讓學員從拓樸的視角理解疾病，而非只記憶條列式特徵。整體靜態部署即可，無需後端，便於分享與長期維運。

# Results（結果）

互動式教材可在課堂上作為教師講解的視覺化輔助，亦可作為學員自學的資源。對於即將參加血液內科專科考試或進階考試者，本工具提供傳統文字教材外的補充形式，特別有助於熟悉 porphyrias 等記憶負擔較重的子主題。

# Discussion（討論）

本專案展示了現代前端框架在醫學教育的應用潛力：互動性能直接服務於學習目標，而非僅是炫技。限制方面，Vue 應用維護需要前端工程能力，對非工程背景使用者較難貢獻內容；醫學知識內容需要持續被同儕檢視。未來可加入測驗模組、多語言版本與 AI 教練式問答。

# 連結

GitHub：htlin222/disorders-of-Iron-metabolism-and-heme-synthesis
主要語言：Vue
最後更新：2026-04-09

my-slidev-template：含 Chart.js 元件與 Tailscale Funnel 開發伺服器的 Slidev 簡報模板

Wed, 08 Apr 2026 00:00:00 +0000

# Introduction（引言）

Slidev 為基於 Markdown 的程式設計師友善簡報工具，能在版本控制下協作維護講稿，並支援程式碼高亮、互動 demo 與動畫。然而其預設模板與醫學／研究演講需求並不完全契合：缺乏統計圖元件、缺乏快速分享連結機制。本專案以個人需求為基底打造可重用模板，將反覆出現的版型、元件與部署設定一次到位。

# Methods（方法）

模板以 Vue 為主要實作技術，整合 Chart.js 提供原生統計圖支援：使用者可在 Markdown 中以結構化資料定義圖表，模板自動產生風格一致的視覺呈現。版型方面預設了標題頁、章節頁、引用頁、結論頁等學術簡報常用樣式。為解決現場演示時的網路分享需求，模板內建 Tailscale Funnel 開發伺服器設定，可一鍵將本機簡報暴露於網際網路供觀眾掃碼觀看。

設計重點為「合理預設、可被改寫」：所有元件皆以 Vue 元件方式提供，使用者可依個別演講需求調整。Markdown 編輯體驗保持單純，避免將模板複雜度推給作者。

# Results（結果）

使用此模板可大幅縮短一場學術演講從草稿到可演示的時間，特別是在有大量資料圖需求的情境（如試驗結果簡報、Meta 分析摘要）。Tailscale Funnel 整合則簡化了「演講中即時分享連結」的痛點，讓觀眾能在自己裝置上同步閱讀，提升互動性。

# Discussion（討論）

本專案展示了「將個人演講基礎建設模組化」的工程實踐：與其每次重做樣板，不如把它打磨為可複用資產。限制方面，Slidev 對複雜動畫的支援仍不及 Keynote／PowerPoint，部分高度視覺性需求需妥協；Tailscale Funnel 需使用者預先設定帳戶。未來可加入更多醫學演講常用元件（試驗流程圖、生存曲線、決策樹），並結合 Claude Code 一鍵生成投影片草稿。

# 連結

GitHub：htlin222/my-slidev-template
主要語言：Vue
最後更新：2026-04-08

vue on 林協霆醫師

disorders-of-Iron-metabolism-and-heme-synthesis：鐵代謝與血基質合成疾患的互動式教學專案

# Introduction（引言）

# Methods（方法）

# Results（結果）

# Discussion（討論）

# 連結

my-slidev-template：含 Chart.js 元件與 Tailscale Funnel 開發伺服器的 Slidev 簡報模板

# Introduction（引言）

# Methods（方法）

# Results（結果）

# Discussion（討論）

# 連結