# 後端工程師
👨‍💻Engineer: Alden
🧑‍💼Manager: 陳厚陽
🧑‍✈️Supervisor: 劉宇倫
## Week1
### 1. 工作主軸
建立專案啟動基礎：角色明確、Backend/Frontend 初始化、Jira 流程、決策改用「瀏覽器端 IFC 解析」並完成初版容器化骨架。

### 2. 已完成事項
- 角色/技術棧確認：Node.js + Express（後端）、Next.js（前端）
- Jira 工作流 & 分支策略草案（main / develop / feature/*）
- Backend/Frontend 初始骨架與基本腳本、API 路徑約定雛形
- 決策：IFC Client-Centric 解析（優勢：減輕後端負載、即時性 ↑；風險：大檔/低性能裝置需 fallback）
- 上傳流程架構 v2.0 圖與 Decision Log（解析→精簡→R2 上傳→索引儲存）
- Docker / Compose：多階段建置 + 服務協作雛形
- 交付文件：Kick-off / Initialization / Architecture / Containerization
- 風險盤點：大型 IFC 性能、無自動化測試、R2 命名規範未定、安全檢查缺位、Viewer 後續邊界待定
### 3. 詳細內容: [工作周誌1](https://hackmd.io/@ranantalden/H15ohMANlg)
## Week2
### 1. 工作主軸
聚焦建立使用者認證基礎（API Contract → Backend 實作 → 前後端串接 → Demo），同步啟動測試與 CI/CD 流程，確保後續功能可擴充與可驗證。

### 2. 已完成事項
- API Contract：定義 Auth 端點（/register /login /me）、User Schema（email/username/passwordHash）、錯誤與回應格式一致化。
- Backend 實作：bcrypt 密碼雜湊、JWT 發行與驗證、中介層（錯誤處理 / auth guard）、Mongoose 連線穩定。
- 前端 UI Scaffolding：Login / Register 表單、Axios 封裝（Base URL + 攔截器自動附帶 Authorization Bearer）、Token 儲存策略（localStorage/待強化）。
- 串接與除錯：新增並調整 CORS 設定、修正 401（缺 Bearer 前綴 / Base URL 錯誤）、前後端端到端測試通過。
- 測試 & CI/CD：建立 Jest（Auth 成功/重複註冊/錯誤登入用例）+ React Testing Library 初始；GitHub Actions：lint → test → build 自動化。
- Demo：週末展示完整註冊 / 登入流程與測試 Pipeline 成功運行，確認下一步需求方向。
- 風險 / 待辦：尚未實作 refresh token、密碼重設、速率限制 / 暴力攻擊防護、欄位更嚴格驗證、測試覆蓋率不足、Secrets 管理需強化（建議引入 Vault / 更細分環境）。
### 3. 詳細內容: [工作周誌2](https://hackmd.io/@ranantalden/rkrMiIQBgx)
## Week3
### 1. 工作主軸
擴充「模型生命週期」核心功能：上傳管線 → 模型 CRUD → 強化使用者/授權控制 → 規劃互動與搜尋延伸功能（評論 / 收藏 / 評分 / 搜尋 / 團隊 / 統計）。奠定後續瀏覽與社交化增長基礎。

### 2. 已完成事項
- 上傳管線（Upload Feature）：Multer 處理、型別/大小驗證、Cloudflare R2 儲存（路徑策略 + 原始檔/派生關聯預留）、Metadata 寫入 Mongo、錯誤分類（驗證 / 存取 / 系統）。
- 模型 CRUD：建立/讀取/更新/刪除 + 權限檢查（擁有者 / 後續可擴角色）、分頁 & 基礎查詢參數、欄位白名單更新策略。
- 認證補強：JWT 中介層整合至 Upload / CRUD、統一錯誤回應格式、（文件化）Refresh / OAuth 延伸計畫。
- 延伸功能設計（Additional Features）：
- 使用者互動：評論、收藏（Collections）、評分、書籤、標籤/分類模型。
- OAuth（Google）與 Email（Nodemailer）驗證流程規劃。
- 模型統計與聚合：瀏覽數、評分平均、熱門排序（Aggregation Pipeline）。
- 搜尋 / 篩選 / 排序：名稱、標籤、擁有者、多欄位排序預留索引策略。
- 團隊 / 協作：Model 成員、權限角色草案。
- 聚合查詢：初步 Aggregation Pipeline 範例（熱門 / 評分 / 近期），確立後續指標收集模式。

### 3. 詳細內容: [工作周誌３](https://hackmd.io/@ranantalden/HJ_2hDcSlx)
## Week4
### 1. 工作主軸
聚焦「對外可見 + 使用者自助管理」層：建立 Public API（匿名瀏覽入口）、User API（自助設定 / 圖像 / Email 變更 / 密碼管理）、前端 Settings Page 串接。同步為後續「團隊 / 權限 / 協作」鋪前置（使用者搜尋、權限介面模式）。

### 2. 已完成事項
- Public API：
- Endpoints：GET /api/public/models（支援搜尋 title/description、分類過濾、排序、分頁）、GET /api/public/categories。
- 目的：Landing / 公開瀏覽，不需登入；建立公開與私有資源邏輯分界。
- User API：
- Endpoints：/me、/profile（PATCH）、/change-password、/profile-picture（POST/DELETE）、/search、/request-email-change、/verify-email-change/:token。
- 功能特點：
- JWT 驗證統一（Email 驗證例外）。
- Profile Picture：雲端儲存 + 更新時刪舊資源。
- 使用者搜尋：支援 username / email（預備邀請工作流）。
- Email 變更：雙步驟 Token 驗證流程（安全 / 可審計）。
- Settings Page（前端整合）：
- 串接所有 Users API（含 Google OAuth 使用者判別）；集中狀態 / 錯誤回饋 / 表單切分（基本資訊 / 密碼 / Email / 圖像）。
- 區分本地註冊 vs Google OAuth（密碼區塊行為差異）。
- 圖片與檔案處理：Profile 圖像上傳與刪除流程定義（避免殘留資源）。
- 安全與一致性：JWT 置於 Authorization Header；Email 變更採 Token 驗證路由隔離。
- 協作前置：User Search 建置 → 後續 Team/Invite 可直接復用。

### 3. 詳細內容: [工作周誌4](https://hackmd.io/@ranantalden/S1MxHJcIxx)
## Week5
### 1. 工作主軸
全站「身份與會話」系統重構：統一本地登入 + Google OAuth 流程、明確後端職責邊界與前端狀態管理層，導入 Token Denylist（登出失效控管）、Remember Me 到期策略、抽離前端 API / 邏輯 / UI 分層，奠定後續權限與多因子擴充基礎。

### 2. 已完成事項
- 架構分層重整（Backend）：
- authController.js：註冊 / 登入 / OAuth callback / 密碼驗證核心。
- passport-setup.js：Google OAuth Strategy（建立或關聯使用者）。
- auth.js Middleware：JWT 驗證 + Denylist 檢查。
- userModel.js：統一使用者資料結構（支援本地與 OAuth 欄位）。
- authRoutes.js：/api/auth* 路由集中管理。
- 前端狀態與邏輯抽象：
- AuthContext.tsx：全域 auth 狀態（token / user / authStatus）+ 啟動時自動 rehydrate。
- useAuthHandlers.ts：整合提交流程（登入 / 註冊 / 登出 / OAuth callback）。
- authApi.ts：純 API 呼叫層（fetch 抽象、錯誤統一）。
- LoginForm / RegisterForm：純展示 + 事件委派（表示層分離）。
- 流程（E2E Flow）標準化：
- Local：表單 → handler → /api/auth/login → 密碼 bcrypt 驗證 → JWT 回傳 → Context 儲存 + 拉取 profile。
- Google OAuth：前端跳轉 /api/auth/google → Google → callback → 建立/查詢使用者 → JWT → 前端 callback 吸收 token。
- 安全與會話管理：
- JWT：預設 1h；Remember Me 延長至 30d。
- Token Denylist：登出即加入，middleware 每請求檢測（避免被動等過期）。
- 持久化：localStorage 儲存 → App 初始嘗試自動登入。
- 文件化：完整圖文描述後端與前端職責、流程步驟、時序敘述（利於新人導入 / 減少口述依賴）。
- 可擴充暗樁：預留可插入 Refresh Token / MFA / 裝置紀錄 / 角色授權層的邏輯位置。
### 3. 詳細內容: [工作周誌５](https://hackmd.io/@ranantalden/BJltq8oPee)
## Week6
### 1. 工作主軸
聚焦「使用者設定 / 資料維護」全端重構：分離控制器與路由、抽象前端邏輯層（Page Hook / Handler Hook / API Service）、強化 Email 安全更換流程、統一使用者資料再取回（重新同步全域狀態）、建立後續擴充（密碼變更、頭像上傳、Credential 安全操作）骨架。此週以「設定頁（Settings）」為核心互動界面，落實前一週身份系統基礎之上之「個資操作 + 驗證鏈」模式。

### 2. 已完成事項
- 後端架構分層：
- userController.js：集中商業邏輯（讀取 / 更新 Profile、驗證密碼、Email 更換流程、可能含頭像與安全操作）。
- userRoutes.js：/api/users 路由聚合（掛載 auth middleware、檔案上傳 middleware）。
- auth.js：沿用 JWT 驗證 → 僅授權本人操作。
- upload.js（multer）：抽離檔案上傳設定（檔案大小 / MIME 基本驗證）。
- 前端邏輯分離：
- settingsPage.tsx：視圖容器（Smart Component），僅調用 hooks + 組件。
- useSettingsPage.ts：頁級本地 UI 狀態（表單值、變更旗標、Modal 顯示、載入狀態）。
- useUserHandlers.ts：橋接 AuthContext + userApi → 封裝所有使用者行為（改名 / 改密碼 / 改 Email / 上傳頭像等）。
- userApi.ts：/api/users* 專屬請求服務層（型別 + fetch 抽象 + 錯誤統一）。
- Modal 組件（ChangePassword / RequestEmailChange / ...）：單一責任、自帶微狀態。
- 關鍵 Flow：
- 使用者名稱變更：UI 輸入 → hasChanges 旗標 → handler 呼叫 PATCH /api/users/profile → 後端驗證唯一性 → 更新成功 → 透過 AuthContext 重新 login(token,{redirect:false}) 觸發 Profile 再同步（全域一致）。
- 安全 Email 更換：請求（輸入新 Email + 當前密碼）→ 後端驗證密碼 + 產生雜湊 Token（含 15 分鐘過期）→ 寄信 → 使用者點擊驗證連結 → 前端 verify 頁自動 POST /verify-email-change/:token → 後端比對雜湊 Token + 時效 → 更新主 email 欄位並清除臨時欄位 → 前端成功提示 + 導回 Settings。
- 一致性設計：變更後均透過重新拉取使用者資料，避免本地 stale state。
- 可持續擴充：既有 hook 分層模式可插入（2FA 啟用、刪除帳號、紀錄登入裝置、通知偏好）。
- 文件清晰化：描述每一層責任邊界 → 有助快速 Onboarding。
### 3. 詳細內容: [工作周誌6](https://hackmd.io/@ranantalden/SymQ9Diwgl)
## Week7
### 1. 工作主軸
聚焦三個核心模組之架構梳理與可擴充策略：
- Collections Pages：重構以支援多組 BIM / 3D 模型集合（可管理 / 篩選 / 延展渲染管線），採用模組化 hooks + API handler + Viewer 分離。
- Models Page：整理模型載入、資料流（後端儲存 → API → 前端狀態 → Three.js / Open BIM Components Viewer）、互動（選取 / 過濾 / 視覺層控制）。
- Team Page：團隊建立、成員管理、角色與權限流程（CRUD、角色賦予、行為限制），補齊協作場景所需的權限邏輯基礎。
本週主題延續前一週「使用者層（User / Settings）」→ 向「專案資產（模型集合） + 協作（Team）」抽象域擴展，為後續更高階協作（註釋、版本、審批）建立穩定底座。

### 2. 已完成事項
- Collections Pages 重構：
- 架構：視圖層 / 邏輯 Hooks（推測：useCollectionsPage, useCollectionHandlers）/ API 層 明確分離。
- 職責拆分：
- 資料載入（列表、集合內模型）
- 過濾 / 分類（依 IFC 類型、標籤、狀態）
- 與 Viewer 溝通（選中集合 → 批量載入或延遲載入策略）
- 可維護性：避免過度集中於單頁；行為以 handler 函式封裝（例如 refreshCollections, attachModel, removeModel）。
- 可擴展基礎：為後續新增版本管理、批次操作、權限差異化顯示提供掛點。
- Models Page Workflow（架構解構）：
- 前端層：React + Hooks 管理 UI 狀態（目前顯示模型、選取幾何、可見性層級、IFC 類別 Filters）。
- Data Flow：
1. API 取得模型 meta（ID、名稱、路徑、IFC 解析狀態、版本號）。
2. 前端建立模型暫存（cache/map）。
3. 請求/串流載入真實 IFC/幾何 → Three.js Scene → Open BIM Components 功能（高亮、剖切、屬性查詢）。
- 互動：點選模型 → 聚焦 / 縮放；篩選 IFC Class → 更新渲染層；選取元素 → 查屬性面板。
- 分層：UI（列表 / 側邊欄）與 Viewer（渲染上下文）隔離，利於替換渲染引擎或增加 SSR Placeholders。
- Team Page Workflow：
- Create Team → 儲存 Team Doc（名稱、擁有者、初始角色集合）。
- 邀請 / 加入：發送邀請（Email / Token）→ 接受 → 成員記錄附帶 Role ID。
- 角色與權限：使用角色集合（role → permission set）抽象，不在程式碼散落硬編碼。
- 成員管理：更換角色、移除成員、轉移擁有者。
- 前端：useTeamPage（狀態：members, roles, pendingInvites），useTeamHandlers（行為：inviteMember, changeRole, removeMember, dissolveTeam）。
- 後端（推測）：Team / Membership / Role 資料模型區隔（避免文件巨大異動鎖）。
- 通用架構模式延伸：
- Hook 分層（Page Hook = 狀態編排；Handlers Hook = 業務行為；API Service = 統一 fetch + 錯誤處理）。
- Domain 邊界更清晰（User / Team / Collection / Model）。
- Viewer 與狀態容器解耦，利於：記憶體釋放、條件卸載、SSR 偽佈景處理。
- 文件化：三份 Technical Research / Analysis 文件補齊溝通語彙，有利新成員 Onboarding（語義: Collections vs Models vs Team）。
- 可觀察點初步辨識：流程節點（載入開始 / 完成、IFC 解析、Viewer 初始化、Team 角色變更）已能成為未來 telemetry 或行為分析插點。
### 3. 詳細內容: [工作周誌7](https://hackmd.io/@ranantalden/ryrLd97Ogx)
## 延伸研究
* [Week 2 - 5G Overview](https://hackmd.io/@ranantalden/BygyV9yyxl)
* [Week 3 - 5G Essentials](https://hackmd.io/@ranantalden/ByUAyclllx)
* [Week 4 - 5G Essentials (with Diagrams)](https://hackmd.io/@ranantalden/HyYbCLolgg)
* [Week 5 - Free5GC and UERANSIM Installations](https://hackmd.io/@ranantalden/H1oCevEbxl)
* [Week 6 - BIM Overview](https://hackmd.io/@ranantalden/Bknowa1mlx)
## 研究來源
[1] L. Peterson and O. Sunay, *5G Mobile Networks: A Systems Approach*. Morgan & Claypool Publishers, 2020.
[2] A. Rudd, P. Lum, and V. Sangam, *Open RAN: The Definitive Guide*. [Online].
[3] C. Eastman, P. Teicholz, R. Sacks, and K. Liston, *BIM Handbook: A Guide to Building Information Modeling for Owners, Managers, Designers, Engineers and Contractors*, 3rd ed. Wiley, 2008.