mkt.ose.tw/docs/frontend/FRONTEND_ARCHITECTURE_SPEC.md

Frontend Architecture Spec

目標

定義 mkt.ose.tw/frontend 的主線架構，讓實驗管理與 Visual Editor 可長期維護。

技術基底

• Vue 3
• Element Plus
• Vuex
• Vite

分層原則

app / shell

• 路由骨架、layout、全域導航

module

• 依業務模組切分：dashboard、experiment、variant、release、editor

service / api client

• 集中 API 呼叫邏輯
• 不在頁面內直接寫散落請求

state

• 僅放跨頁狀態與 session
• 頁面暫存留在模組內

主線與 legacy 邊界

• experiment / variant / release / editor 為主線
• ose-card / conutdown-timer 為 legacy 過渡模組
• 新功能不再掛到 legacy 路徑

API 邊界

• Frontend 主入口為 FastAPI
• Directus 保留在登入與既有相容路線
• 不再新增頁面直接耦合 Directus raw response

近期重點

• Editor 穩定化（選取、編輯、結構、history）
• 管理流補齊（create/edit/build/publish/rollback）
• 逐步收斂語言與操作流程（流程化、簡單化、中文化）