「校園點餐系統 (Campus Food Order) v3.4.2」是阿凱老師為校慶園遊會打造的 Firebase + React 三端分離點餐平台，專門解決「100-200 個攤位排隊找零亂、紙板菜單會掉、廚房不知道誰是顧客、老師統計營收要熬一整晚」的混亂痛點。
🎯 核心特色
- 🔀 三端完全分離 —
/order/:classId顧客點餐、/kitchen廚房管理、/display/:classId大螢幕叫號各自獨立路由，互不干擾 - 🏫 多班級獨立庫存（v3.0.0 大改版） — 每班一個攤位、各自菜單與庫存，店長可在後台一鍵切換班級
- ⚡ Firestore 即時同步 — 訂單狀態 Pending / Preparing / Completed / Paid / Cancelled 全裝置秒級更新
- 🔐 OAuth 三層權限 — owner（完整權限可清資料）/ staff（接單調庫存）/ none（防無權人員亂改）
- 📱 PWA 就緒 — 可安裝主畫面、前端 localStorage 快取支援離線
- 🎫 動態取餐叫號 — 大螢幕顯示「602 班 - 第 12 號餐已完成」，全程無紙本、無人工算錢
💡 設計理念
本系統由 #27 swissknife 許願池 早期的「校園點餐後台」+「取餐叫號區」漸進式升級而來。v1.0 期 Google Sites Embedded → v3.4.2 期 GitHub Pages + Firebase Hosting 三端分離架構，是阿凱「工具家族漸進升級」的代表案例（同款邏輯也見於 #87 PIRLS Pro 升級自 #4）。技術棧 React + Vite + TypeScript + Zustand + Firebase Firestore + Authentication，Cloud Functions 選用提供 /getMenu /getTrending /placeOrder /getStats 等 API 端點。
🎒 適合情境
校慶園遊會單日 4-6 小時運作：顧客掃 QR 進 /order/602 點 602 班攤位、廚房學生在 /kitchen 接單、大螢幕掛 /display/602 自動叫號。期末用 /admin 一鍵看全校營收 + 哪班最熱銷 + 平均等待時間。配對 #48 動態表單系統 處理一般報名、#3 即時投票 用同款 Firebase 即時架構辦活動投票。MIT 授權，歡迎其他學校 fork 改成自己的版本。