📝 #24 校務會議紀錄報告站：把石門國小 114 學年度期末會議「致詞 + 處室報告 + 自治市長 + 提案討論」做成單頁互動 SPA
#24 真實名稱是「桃園市龍潭區石門國小 114 學年度上學期期末校務會議紀錄」— 用純 Tailwind + Noto Sans TC + Lucide 把整份會議紀錄做成 6 章節互動式 SPA，嵌進 Google Sites Embedded HTML。含張定貴校長致詞 / 家長會長致詞 / 自治市長潘宥睿致詞 / 教務處報告 / 學務處報告 / 提案討論 / 附件規約 / 下學期重要行事簡曆。
校務會議紀錄為什麼要做成網頁？
傳統校務會議紀錄是 Word / PDF 文件：
- 老師收到 → 隨便翻一下 → 丟在桌上
- 家長 / 學生看不到（只在校務行政群組流通）
- 「下次會議要追上次決議」→ 翻舊檔翻到崩潰
- 「自治市長講了什麼」→ 沒人記得
阿凱的解法：把整份會議紀錄變成一個互動式 SPA，嵌進學校 Google Sites 公開頁，全校都能看 + 留作公開紀錄。
#24 真實怎麼做？（curl Google Sites data-code 反推）
真實標題：「桃園市龍潭區石門國小 114 學年度上學期期末校務會議紀錄」
6 大章節（從 H 標籤抽出的真實內容）：
- 致詞與報告摘要
- 主席致詞（張定貴校長）
- 家長會長致詞
- 自治市長致詞（潘宥睿）
- 上次會議決議執行情形
- 教務處報告
- 學務處報告
- 提案討論
- 附件規約
- 下學期重要行事簡曆（115 年）
導覽列按鈕：首頁 / 致詞與報告 / 教務處 / 學務處 / 提案討論 / 附件規約 — 6 個 tab 切換，不用滾動找。
真實技術棧（純前端，無 LLM）
- Tailwind CSS（
cdn.tailwindcss.com） - Noto Sans TC（Google Fonts）
- 無 LLM（純內容呈現，不需要 AI）
- 單檔 HTML 31358 字元（data-code 屬性內）
- 嵌進
sites.google.com/mail2.smes.tyc.edu.tw/114teacher/的 Embedded HTML - 由 Google sandbox iframe 執行
跟 #80（下學期）的關係
- #24 = 114 學年度上學期期末會議紀錄
- #80 = 114 學年度下學期教師會議報告集合站（待寫）
- 兩者是同款架構的不同學期版本，阿凱每學期都做一份
為什麼這個值得部落格寫？
| 傳統會議紀錄 | #24 互動 SPA |
|---|---|
| Word / PDF 寄附件 | 公開網址直接看 |
| 找特定段落要捲動 | 6 章節 tab 切換 5 秒到位 |
| 家長看不到 | 掛在學校 Google Sites 公開 |
| 校長致詞被忘記 | 獨立章節保留校長 + 家長會長 + 自治市長 3 位致詞 |
| 提案討論散落 | 「提案討論」獨立區塊 + 決議追蹤 |
| 印列印列印 | 零紙本，永久保存 |
老師回饋（情境推想）
「自治市長潘宥睿同學的致詞被獨立放一章 — 我女兒看完跟我說『我也想當自治市長講話』」
— 學生家長
「以前每學期會議紀錄要影印 50 份分各班導 — 現在傳一個網址就好，還能隨時回看上學期決議」
— 教務組長
「接班的新老師看完前一學期所有報告 + 決議只要 15 分鐘 — 無痛交接」
— 學年主任
配對工具推薦
- #80 114 石小教師會議報告集合站（下學期） — 同款架構下學期版
- #15 社群領域會議報告產出平台 — 領域會議專用
- #84 會議記錄自動產出 Pro — AI 會議記錄
適用對象
- 所有國中小教務處
- 想公開化會議紀錄的學校
- 自治市 / 學生會記錄
- 行政透明度倡議者
想試試？
可以「用 Gemini 寫好 SPA + 貼 Google Sites Embedded HTML」一條龍仿做你校的版本。