📖 #4 PIRLS 閱讀理解生成（pirlss.smes Firebase Hosting）：跟 #87 PIRLS Pro 是同 repo 兩部署的 Firebase Hosting + 學校自訂域名版本
#4 pirlss.smes.tyc.edu.tw 跟 [#87 PIRLS Pro](/blog/pirls-87-questioncraft-rewrite) 是**同個 cagoooo/pirls-questioncraft repo 的兩個部署**！#4 用 Firebase Hosting + 學校自訂域名，#87 用 GitHub Pages。Next.js + Tailwind + shadcn/ui + Radix UI 完全相同架構。同樣含 8 / 10 題模式 + 繁中 / English 雙語 + Gemini 2.5 Flash 出題。
#4 跟 #87 是同源雙部署
curl 抓 pirlss.smes.tyc.edu.tw 真實 HTML 後，發現它是 Next.js + Tailwind + shadcn/ui + Radix UI 架構，跟我之前寫過的 #87 PIRLS QuestionCraft Pro 完全一樣！
驗證：
- #4 pirlss.smes title 寫「PIRLS 閱讀素養題組生成站」
- #87 cagoooo.github.io/pirls-questioncraft 同款 title
- 都有「標準模式 (8題)」「延伸模式 (10題)」「繁體中文 / English」雙語
- 都用 lucide-react icons + Tailwind + Radix
- 都標榜「上傳圖片或貼上文本 → 自動分析 → 設計 PIRLS 四層次選擇題」
→ #4 = #87 同個 cagoooo/pirls-questioncraft repo 的兩種部署方式。
為什麼阿凱要部署兩次？
部署 1：GitHub Pages（#87 主推版）
- ✅ 免費
- ✅ commit 即上線
- ✅ 簡單
部署 2：Firebase Hosting + 學校自訂域名（#4 學校官方版）
- ✅ 掛
pirlss.smes.tyc.edu.tw學校信任度高（家長看到 smes 網域才會點） - ✅ Firebase 雲端基礎設施
- ✅ Cloud Functions 後端與 Hosting 在同一專案
- ❌ 部署較複雜（要
firebase deploy）
結論：阿凱用兩種部署服務不同受眾：
- 工程師 / 社群分享 → GitHub Pages 版（#87）
- 學校內部教師 / 家長 → Firebase Hosting 版（#4，掛學校網域）
為什麼這值得寫獨立文章？
#87 已寫過詳細功能介紹 — 但 #4 代表「阿凱部署策略」的另一面：
| 工具 | GitHub Pages 版 | Firebase Hosting + 學校網域 |
|---|---|---|
| PIRLS Pro | #87 cagoooo.github.io/pirls-questioncraft | #4 pirlss.smes |
| 5W1H Aura | #92 cagoooo.github.io/Aura | #13 5w1h.smes |
| PhotoPoet | （隱藏？） | #14 poet.smes |
→ 8 個 Firebase Hosting 工具中至少 3 個是 GitHub Pages 工具的「學校網域副本」。
完整功能（同 #87，從 #4 HTML 再驗證）
從 curl 抓的 HTML 抽出的真實 UI 元素：
- 上傳圖片 tab：「點擊此處或拖曳圖片至此上傳（或截圖貼上）」
- 貼上文本 tab
- 「已選 0/4 張圖片」
- 題組模式：
- 標準模式 (8題) — 各 PIRLS 層次各 2 題，適合標準評量
- 延伸模式 (10題) — 強化基礎能力：訊息提取與直接推論各 3 題
- 語言模式：
- 繁體中文 — 所有內容均以繁體中文呈現
- English — 題目與選項為英文
- 「生成 PIRLS 題目」主按鈕
- 右下浮動「創建專屬助手 🦄」連 Replit（#19）
- 右下浮動「點石成金 🐝 (評語優化)」連 LINE Bot（#7）
完整 SEO meta（從 HTML <head> 抽出）
<meta name="author" content="桃園市石門國小資訊組 阿凱老師" />
<meta name="keywords" content="PIRLS,閱讀素養,題目生成,教育科技,AI 輔助教學,繁體中文,台灣適用,圖片轉文字,自動出題" />
<meta property="og:image" content="https://pirlss.smes.tyc.edu.tw/images/social-preview.png" />
完整 SEO 對齊：author / keywords / og:image / og:image:width 1200 / og:image:height 630 全部標準齊備。
教學情境（跟 #87 重疊但用學校網域更方便）
家長 LINE 群組分享：
- 老師：「讓孩子練 PIRLS 閱讀理解」https://pirlss.smes.tyc.edu.tw/
- 家長看到 smes 網域 = 信任度爆表（不會點到釣魚網站的擔憂）
校際分享 / 教師研習：
- 講師：「阿凱老師的 PIRLS 工具掛在學校網站 → smes.tyc.edu.tw 子網域」
- 顯示「這真的是石門國小老師做的」
配對工具推薦
- #87 PIRLS QuestionCraft Pro — 主要版本（GitHub Pages）
- #12 PIRLS 閱讀理解網 — 學校閱推總入口
- #92 5W1H Aura — 同款雙部署案例
適用對象
- 國小三到六年級國語老師
- 想做學校內推 PIRLS 工具的學校
- 看「GitHub Pages + Firebase Hosting 雙部署策略」案例的開發者
想試試？
→ 前往 #4 PIRLS 閱讀理解生成（pirlss.smes） → #87 PIRLS Pro（GitHub Pages 版）
實際功能完全一樣 — 掛學校網域 vs 掛 cagoooo.github.io 看你想分享給誰。