活動頁整合平台

本片亮點特色

• 多專案路徑整合

  將多個活動頁整合到同一個應用，以路徑區分。導流時只需處理各路徑所需的資料，例如網址帶入的參數。

• 設定的單一來源（SSOT）

  把各專案不同的 UI 與設定彙整成單一來源，型別由設定本身推導，降低撰寫錯誤與維護成本。

• 型別約束的設定對照表

  以對照表取代分散在各處的 switch 判斷。新增方案時漏寫任何設定，型別檢查就會報錯，未知的值則回退到預設。

• 統一的 UI

  以 Vuetify 統一各活動頁的介面，取代各自為政的樣式。

• LINE 登入與例外處理

  以 LIFF 串接 LINE 登入，統一處理載入流程與登入失效等例外情況。

幕後花絮難題與解法

1. 01 活動頁各自為政，改一處要動好幾處

   難題

   多個活動頁各自以 HTML、JS 撰寫，UI 不一致。同類設定分散在各處，規則容易分歧，改一處要連動修改好幾處。

   解法

   整合成 Vue 的單一應用，以路徑區分各專案。設定集中成單一來源，並以 TypeScript 約束，漏寫或寫錯在型別檢查就會發現。