EXARC (Express ARC JS Starter Kit)
-- 為 Delphi 開發者打造的現代化 Web 開發框架
🎯 給熟悉 DataSnap、MVC、WebBroker 的您
如果您曾經使用過 Delphi DataSnap REST 的代理自動生成功能，或是體驗過 Delphi MVC Web Framework 的路由機制，那麼 EXARC 將會讓您感到非常熟悉。它將 Delphi 開發中最優雅的概念帶到了現代 JavaScript 生態系統中。
🔄 從 Delphi 到 JavaScript：相似的開發哲學
DataSnap REST 的現代化演進
還記得 Delphi DataSnap 如何自動為您的伺服器方法生成用戶端代理嗎？EXARC 採用了相同的理念：
| Delphi DataSnap | EXARC | 相似度 |
|---|---|---|
| 伺服器方法定義 | Express 路由定義 | ✅ 相同概念 |
| 自動生成用戶端代理 | 自動生成 apiProxy.js | ✅ 相同機制 |
| 型別安全的呼叫 | 語義化的 async 呼叫 | ✅ 相同體驗 |
| 內建認證支援 | JWT 認證中介軟體 | ✅ 相同功能 |
// Delphi DataSnap 伺服器方法
function TServerMethods.EchoMessage(const AMessage: string): string;
begin
Result := 'Echo: ' + AMessage;
end;
// 自動生成的用戶端代理呼叫
ClientModule.ServerMethods.EchoMessage('Hello');
// EXARC Express 路由定義
app.get('/api/echomsg/:msg', (req, res) => {
res.json({ echoed: req.params.msg });
});
// 自動生成的前端代理呼叫
await apiProxy.echomsg('Hello');
MVC Web Framework 的路由理念
熟悉 Delphi MVC 的路由屬性嗎？EXARC 採用了相似但更簡潔的方式：
// Delphi MVC Controller
[MVCPath('/api/users')]
[MVCHTTPMethod([httpGET])]
function GetUserList: TObjectList<TUser>;
// EXARC Express 路由
app.get('/api/users/list', (req, res) => {
res.json(getUserList());
});
// 自動生成: apiProxy.usersList()
💡 為什麼 Delphi 開發者會愛上 EXARC？
1. 熟悉的開發模式
您已經習慣了 Delphi 的「定義一次，處處可用」理念：
- DataSnap: 定義伺服器方法 → 自動生成用戶端代理
- EXARC: 定義 Express 路由 → 自動生成前端代理
- 結果: 相同的開發體驗，但擁抱現代 Web 技術
2. 強型別思維的延續
雖然是 JavaScript，但 EXARC 透過 JSDoc 和自動生成機制，提供了接近強型別的開發體驗：
/**
* 建立使用者資料
* @param {Object} userData - 使用者資訊
* @param {string} userData.name - 使用者姓名
* @param {string} userData.email - 電子郵件
* @returns {Promise<Object>} 建立結果
*/
app.post('/api/users/create', (req, res) => {
// 業務邏輯實作
});
// 前端呼叫時會有清楚的參數提示
await apiProxy.usersCreate({
name: "John Doe",
email: "john@example.com"
});
3. 內建的測試和除錯工具
就像 Delphi IDE 的整合除錯環境，EXARC 提供內建的 API 測試器：
- 自動掃描所有 API 端點（類似 DataSnap 的伺服器方法瀏覽器）
- 即時參數輸入和測試（類似 Delphi 的 Method Invoker）
- 即時回應查看（類似 REST Debugger）
🚀 技術架構對比
從 WebBroker 到 Express.js
| 概念 | Delphi WebBroker | EXARC Express.js |
|---|---|---|
| HTTP 伺服器 | TWebModule + HTTP.sys | Node.js + Express |
| 路由處理 | WebActionItem | app.get/post/put/delete |
| 中介軟體 | WebModule Events | Express Middleware |
| 靜態檔案 | DocumentRoot | express.static |
| 會話管理 | TWebSession | JWT Token |
從 DataSnap 到 EXARC
// Delphi DataSnap 架構
TServerContainer -> TDSServer -> TServerMethods
-> Auto-generated Client Proxy
// EXARC 架構
Express Router -> API Routes -> Auto-generated apiProxy.js
-> Dynamic API Invoker
🔧 實際開發對比
Delphi DataSnap 開發流程
// 1. 定義伺服器方法
function TServerMethods.GetCustomerOrders(CustomerID: Integer): TJSONArray;
begin
// 實作業務邏輯
end;
// 2. 編譯專案，自動更新用戶端代理
// 3. 用戶端呼叫
ClientModule.ServerMethods.GetCustomerOrders(123);
EXARC 開發流程
// 1. 定義 Express 路由
app.get('/api/customers/:id/orders', (req, res) => {
const customerId = req.params.id;
// 實作業務邏輯
res.json(getCustomerOrders(customerId));
});
// 2. 儲存檔案，自動更新前端代理
// 3. 前端呼叫
await apiProxy.customersOrders(123);
相似度：95%！
🌟 EXARC 相比 Delphi 的優勢
1. 現代化的生態系統
- 豐富的套件庫: npm 生態系統 vs GetIt Package Manager
- 跨平台部署: Linux/Windows/macOS vs Windows 主要
- 容器化支援: Docker 原生支援 vs 需要額外配置
2. 前端技術選擇自由
- 多框架支援: React, Vue, 原生 JS vs 主要是 Delphi 用戶端
- 響應式設計: 內建 Mobile-first 設計
- 現代 UI 框架: Tailwind, Bootstrap 等
3. 開發工具整合
- VS Code 完整支援: IntelliSense, 除錯, Git 整合
- 熱重載: 程式碼變更即時生效
- DevTools: 強大的瀏覽器除錯工具
4. 部署和維運
- 雲端原生: 天然支援 AWS, Azure, GCP
- CI/CD 整合: GitHub Actions, GitLab CI 等
- 監控和日誌: 豐富的 APM 工具
🎯 遷移建議：從 Delphi 到 EXARC
階段一：概念對應
- DataSnap 伺服器方法 → Express 路由
- ClientDataSet → JSON 資料處理
- WebBroker Actions → Express 中介軟體
- ISAPI/CGI → Node.js HTTP Server
階段二：逐步遷移
- API 層先行: 將 DataSnap REST 服務改寫為 Express API
- 保持資料庫: 繼續使用現有的 SQL Server/Oracle/FireDAC
- 前端現代化: 逐步將 VCL/FMX 用戶端改為 Web 介面
- 認證統一: 從 Session-based 遷移到 JWT
階段三：現代化升級
- 導入 TypeScript (可選)
- 整合現代 CSS 框架
- 實作 PWA 功能
- 加入自動化測試
📊 成本效益分析
Delphi 開發 vs EXARC 開發
| 項目 | Delphi 生態 | EXARC + Node.js |
|---|---|---|
| 授權成本 | Delphi Professional: $1,500+ | 完全免費 |
| 伺服器授權 | Windows Server 授權 | Linux 免費 |
| 部署成本 | IIS + Windows | Docker + 雲端 (更便宜) |
| 維護成本 | 需要 Delphi 專家 | JavaScript 開發者更易找 |
| 學習曲線 | 對 Delphi 開發者: 低 | 中等 (但概念相似) |
🛠️ 實作範例：從 DataSnap 到 EXARC
Delphi DataSnap 範例
unit ServerMethodsUnit;
interface
uses
SysUtils, Classes, DSServer, DSAuth, DataSnap.DSProviderDataModuleAdapter,
Datasnap.DSClientMetadata, Data.FireDACJSONReflect, Data.DB;
type
TServerMethods = class(TDSServerModule)
private
public
function GetUserProfile(UserID: Integer): TJSONObject;
function UpdateUserProfile(UserID: Integer; ProfileData: TJSONObject): Boolean;
end;
implementation
function TServerMethods.GetUserProfile(UserID: Integer): TJSONObject;
begin
// 實作取得使用者資料邏輯
Result := TJSONObject.Create;
Result.AddPair('id', TJSONNumber.Create(UserID));
Result.AddPair('name', 'John Doe');
end;
function TServerMethods.UpdateUserProfile(UserID: Integer; ProfileData: TJSONObject): Boolean;
begin
// 實作更新使用者資料邏輯
Result := True;
end;
EXARC 對應實作
// server.js
const express = require('express');
const app = express();
app.use(express.json());
// 對應 TServerMethods.GetUserProfile
app.get('/api/users/:id/profile', (req, res) => {
const userId = parseInt(req.params.id);
// 實作取得使用者資料邏輯
const userProfile = {
id: userId,
name: 'John Doe',
email: 'john@example.com'
};
res.json(userProfile);
});
// 對應 TServerMethods.UpdateUserProfile
app.put('/api/users/:id/profile', (req, res) => {
const userId = parseInt(req.params.id);
const profileData = req.body;
// 實作更新使用者資料邏輯
const success = updateUserProfile(userId, profileData);
res.json({ success: success });
});
app.listen(3000);
自動生成的前端代理
// apiProxy.js (自動生成)
export const apiProxy = {
/**
* 取得使用者資料
* @param {number} id - 使用者 ID
* @returns {Promise<Object>} 使用者資料
*/
usersProfile: async (id) => {
return handleApiCall(api.get, `users/${id}/profile`);
},
/**
* 更新使用者資料
* @param {number} id - 使用者 ID
* @param {Object} data - 更新資料
* @returns {Promise<Object>} 更新結果
*/
usersProfileUpdate: async (id, data) => {
return handleApiCall(api.put, `users/${id}/profile`, data);
}
};
// 使用方式 (類似 DataSnap 用戶端代理)
const profile = await apiProxy.usersProfile(123);
const result = await apiProxy.usersProfileUpdate(123, { name: 'Jane Doe' });
🎉 結論：擁抱現代化，保持熟悉感
EXARC 為 Delphi 開發者提供了一條平滑的現代化遷移路徑：
✅ 保留 Delphi 的優雅設計理念 - 自動化、強型別思維、整合開發體驗
✅ 擁抱現代 Web 技術 - JavaScript 生態、雲端原生、跨平台部署
✅ 降低學習成本 - 相似的概念映射、熟悉的開發流程
✅ 提升競爭力 - 更低的成本、更大的人才庫、更好的擴展性
立即開始您的現代化之旅
# 30 秒體驗 EXARC
npx degit Eden5Wu/EXARC my-modern-api
cd my-modern-api && npm install && npm run dev
# 訪問 http://localhost:8893/apiProxyInvoker.html
# 體驗類似 DataSnap Method Invoker 的測試工具！
從 Delphi 到 EXARC，不是放棄過去，而是站在巨人的肩膀上擁抱未來。 🚀
📞 技術支援
- GitHub: Eden5Wu/EXARC
- 遷移指南: [專為 Delphi 開發者準備的詳細文檔]
- 範例專案: [DataSnap 到 EXARC 的完整遷移範例]
讓我們一起將 Delphi 的優雅帶入現代 Web 開發！ 💪