NEWOIL 3

專案概述

NEWOIL 3 是一個類似 WordPress 的快速架站系統，目的是讓公司客戶在短時間內就可以快速擁有自己的網站。

我認為這個系統重度仰賴業界經驗，是我開發過最具挑戰性及最有成就感的系統。

專案類型: CMS 快速架站系統

開發時間: 2023年3月

主要技術: Laravel, Vue2, Docker

服務客戶數: 60+ 企業客戶

支援語系: 22 種語言

權限管理: 226 個細粒度權限

核心設計理念

下面我將用一個範例說明這個系統的核心設計理念。

假設情境

有 5 位客戶：A、B、C、D、E

需求：聯絡我們表單

客戶 A
- 姓名、電話、Email
客戶 B
- 姓名、留言、Email、傳真
客戶 C
- 電話、從哪裡得知、性別

開發思路

剛開始遇到這種問題，直覺性的設計就是把所有欄位聯集起來，透過開關控制。但當客戶數量越來越多，資料庫欄位和開關就會越來越多。

不同客戶的表單欄位需求展示

兩大核心概念

🔄

批量更新 (Batch Updates)

當有新功能或 Bug 時，一次更新所有網站（n 個客戶）

案例：Email 寄送

當需要更換 Email 服務商或修改郵件標題時，只要程式碼一致（同一個 git repo），就能在 10 分鐘內更新近 57 個網站（真實案例數字）。

🧠

抽象思考 (Abstract Thinking)

提升一層思維維度，考慮各種不同需求的設計方法

解決方案：動態表單

使用 動態表單建立 取代固定欄位設計，讓相同的 git 專案能夠適應各種不同的需求。

後台管理介面，提供直覺的內容管理功能

動態表單設定，可彈性配置各種欄位組合

系統功能

🌍

22 種語系

後台開關設定，支援全球化多語系網站

🔐

角色權限系統

權限細到欄位，共有 226 個細粒度權限

📁

無限層級架構

多語系的類別、頁面、產品類別與產品，支援無限層級

👥

會員系統

三方登入、審核機制、會員等級、動態註冊欄位

📝

表單管理

條件發送、動態表單設定、表單群組

🎫

行銷管理

優惠券系統

🔍

SEO 自動化

每個頁面自動產生 JsonLD，一鍵開關上下架 SEO

🎨

UI 客製化

主題切換、多語系 banner

系統展示

技術實作

專案職責

在這系統我負責 Server 以及後端還有後台，每個專案都是前後分離。

批量更新的技術基礎

所有客戶網站使用相同的 git repository，統一的程式碼基礎讓批量更新成為可能。當需要新增功能、修復 Bug 或更新依賴時，可以在短時間內部署到所有客戶網站。

抽象思考的實踐

透過動態表單建立、動態欄位註冊等技術，讓系統能夠適應各種不同的需求。這種設計方法雖然增加了初期的開發複雜度，但大幅降低了長期維護成本。

使用技術

後端

Laravel Framework
Custom Composer Package
RESTful API Design

Server

Laradock (Docker 容器化)
Redis (快取系統)
MySQL (資料庫)

後台

Vue2
vue-router
vuex (狀態管理)
vue-i18n (多語系)
Ag-grid (表格元件)
Tinymce (富文本編輯器)
Filebrowser (檔案管理)

Monitoring

Uptime-Kuma (服務監控)

專案特色

業界經驗的結晶

這個系統是經過 60+ 客戶需求淬鍊而成的成果。每個功能的設計都考慮到實際應用場景，不是憑空想像而是從真實需求中歸納總結。

可維護性優先

雖然初期開發需要更多的抽象思考，但統一的程式碼基礎和批量更新機制，讓長期維護成本大幅降低。當有新需求時，可以同步更新所有客戶網站。

靈活性與標準化的平衡

透過動態配置滿足客製化需求，同時保持程式碼的統一性。這種設計哲學讓系統既能應對各種不同需求，又能維持良好的可維護性。