QuizLab 開發紀錄：做一個不背答案的考題學習工具

QuizLab 的開發契機主要來自學校的期中考。當時老師提供了一份考古題，並希望我們不要只是死背題目和答案，而是能夠理解題目背後的觀念，尤其是面對不同變化的應用題時，也能運用學到的知識來解決問題。因此，老師給了我們一個任務，希望我們製作一個能夠智慧出題、協助學習的刷題平台。

我覺得這個想法其實很不錯，因為傳統刷考古題很容易變成反覆記憶答案，遇到題目稍微改變，就可能不知道該怎麼回答。如果能透過 AI 產生不同變化的題目，讓學生練習理解與應用，而不是只記住選項，我認為會更有學習價值。

另外，我也發現現在有不少 AI 智慧出題或學習平台都需要付費訂閱，對學生來說，長期使用可能是一筆負擔。因此，我也希望 QuizLab 能成為一個對學生比較友善的學習工具，讓使用者不必一直花錢，才能透過智慧出題來練習與複習。

對我來說，QuizLab 不只是為了完成老師交代的任務，也是一次把實際學習需求轉化成軟體專案的機會。我希望它能真正幫助學生提升學習效率，而不只是增加另一個刷題網站。

技術架構

• 框架：Nuxt 4（Vue 3 + TypeScript），純前端、nuxt generate 靜態輸出。
• 資料：Dexie / IndexedDB 存題庫、作答與複習紀錄，Zod 驗證匯入資料。
• 文件解析：pdfjs-dist 讀 PDF 文字與顏色，unified + KaTeX 處理 Markdown 與公式。
• 離線：PWA，Service Worker 快取。
• 測試：Vitest 測核心邏輯，Playwright 跑 Chromium / WebKit。
• 部署：Cloudflare Pages。

不需要登入、帳號或後端，資料只存在自己的瀏覽器裡。判分、匯入、複習排程這些核心邏輯放在 app/core/，和畫面分開，方便單獨測試。

核心功能

• 匯入題庫：支援文字型 PDF、TXT、Markdown、JSON 與直接貼上，解析後先預覽、修正再存進題庫。
• 學習模式：一次一題，答錯當下就看到一句話解析和各選項錯在哪；需要時再展開完整詳解。
• 錯題與間隔複習：答錯自動記錄，答對後依 1、3、7 天排下次複習。至少在三個不同日期答對、而且涵蓋兩道不同的題目，才算真正掌握。
• 變化題：同一個知識點換情境出題；只把選項洗牌不算變化題。
• 考試模式與學習報告：可選章節、題數與計時；報告列出各章節掌握度和最需要複習的概念。

開發挑戰與解決方式

PDF 的紅字答案很難判斷。 考古題常用紅字標答案，但只看文字或只看顏色都容易誤判。我的做法是同時核對文字、紅色像素和選項位置，三者對得上才採用；局部標色或對不起來的題目一律標成「待處理」，不硬猜。

AI 給的答案不一定對。 我把答案分成四種狀態：來源答案、AI 查證（附至少兩個不同網域的引用）、未驗證、待處理。只有前兩種會正式計分和進考試，AI 自己推導的答案只能當參考。

不想讓使用者付費或交出 API Key。 除了可選的 AI API，我另外做了「AI 解析包」：QuizLab 依章節產生提示詞，使用者貼給任何免費的聊天 AI，再把回傳的 JSON 貼回來。匯入前會檢查題目 ID 和版本，只補缺少的欄位，不覆蓋原本的資料。