Translate

2017/09/01

DataSnap REST + JS framework = full stack development (CHT)


ExpressWeb Framework, IntraWeb, UniGUI, Raudus, Elevate Web Builder, Kitto, Delphi MVC Framework...

Delphi 這麼多 Web Solution 中,你用過哪幾種?



ExpressWeb Framework:

DevExpress 的 Web 框架,如果當初有發展,IntraWeb、UniGUI 應該不復存在,可惜歷史沒有如果,DevExpress 之後轉向 ASP.NET 發展去了,這套框架已永遠雪藏。


IntraWeb:

ATOZED (Indy) 團隊的另一長青作品,以 VCL for Web 為號召,具備 Web Application 自動建立功能,另外輔以 Page Mode,可以讓使用者自訂 HTML 套版,以達成自訂樣式的需求。

優點:IW 也具備了擴充功能,不足的功能或畫面可以再找 3rd 廠商購買外掛。

缺點:實際把玩後,深覺它的 UI 介面非常陽春,彈性方面也到近乎 DIY WebBroker 的等級,HTML, CSS, JavaScript 也還是得學,IW 框架也要學,開發便利性很快被後起產品超越,相關外掛買齊所費不貲。


UniGUI, Kitto (base ExtJS), Raudius(base VanillaJS→RfeJS):

除了前端框架不同外,這 3 個框架目標是相同的:Web Application,更貼近 VCL for Web 的概念,開發者只需要專注 Pascal 邏輯開發,其它的呈現的方式就不需再去煩腦。

優點:持續發展,幾乎不用考慮前端開發。開發速度也是所有框架最快的!

缺點:因以 ISAPI 發展,前端就算要修改一個字,也必須重新發佈 ISAPI,和 WinForm 有相同的問題,唯解決方式亦同 WinForm。


Elevate Web Builder:

最有潛力,但發展步調最慢的框架。利用獨家轉譯技術,把 UI 轉成 HTML + CSS ,把 Pascal 轉成 JavaScript 檔案,這個方式就能像 ASP.NET 一樣做到網站檔案熱抽換的能力。

優點:可視化的 IDE、可視/不可視元件皆可繼承使用,以及發佈時網站檔案熱抽換,這是其它框架做不到的!

缺點:發展步調緩慢,教學文件稀少,每個帳號僅限下載一個版次,不知道廠商對這產品是否有心發展。


Delphi MVC framework:

從說明文件來看,它的框架位階等同是 DataSnap REST framework。一樣是基於 WebBroker,但並不依賴它。

後端部份為基於 Custom Attributes 的 MVC 框架,與前端連結則有 JavaScript DMVC framework 作橋接;前端 HTML, CSS 仍需要手刻。

優點:從文件來看,完成度相當高,從學習 MVC 角度來看是極好的,再著,它也有內建 DMVCRazor (Server side views uses the Lua language) 這讓前端的靈活度大為提升,使用得當,可以有效減少後端更新的次數。

缺點:獨立的分支框架,意謂著能取得的學習資源更少,最小支援版本:XE3;同樣的,HTML, CSS, JavaScript 學習一樣不可少。




要輕要巧要便宜又要好,似乎沒有這麼吃香的解決辦法,如果你有對 Delphi 無盡的愛,那麼就推薦你這套在  2009 年推出,在 2010、2011 年發展,於 2012 年熟成到現在的:

DataSnap REST framework!

Web 已經發展到讓我不得不去正視它,無奈 Delphi 一直沒有可以通吃的方法,學習 HTML, CSS, JavaScript 是免不了的。

寫網頁是一種趨勢,用什麼框架是一種選擇。

為什麼不用 WebBroker?

WebBroker 是工具,而因為 DataSnap REST 讓它有開始有了靈魂!

DataSnap REST framework 對於 JavaScript 也有推出 JavaScript REST framework,專案裡內建的範例也都是基礎 JavaScript 的語法,所以學習這套框架有助於自己的 JS 基礎發展。

接著就是選擇一套和自身技術有關的框架學習,EasyUI 算是可以輕鬆上手的框架。

在為期四週的密集練習,安排的事項如下:

  1. Login Window 和 Main Form 切換 
  2. Session 控制,讓每個 Page 都能自由使用 REST API
  3. Main Form: Banner 設計
  4. 額外的應用︰PHP LOGIN
  5. Layout 設計
  6. JavaScript REST DataSnap framework 改造 (Json.JS to Json2.JS)
  7. 額外的應用︰架設在 IIS 上使用
  8. 額外的應用:使用資料庫進行驗證
  9. jQuery ajax 和 JavaScript REST DataSnap framework 結合
  10. 初步完成動態產出畫面
  11. Dom 物件動態加入事件
  12. Tree JSON 處理
  13. EasyUI DataGrid 自訂分頁
  14. 額外的應用:修正 XE1 無法取得 QueryParams 問題 (但不修正也沒什麼影響,因為 JS 元件預設連線的方式和 DataSnap 就是不合)
  15. jQuery 基礎研習
  16. VanillaJS 再練習 (笑)
  17. Cache file Download
  18. CSV file Export
  19. Base CURD
  20. Callback


有了 EasyUI 的搭配,前端整體開發上省心許多,EasyUI,感謝有你!

後端少了原本前端常用的元件,少了許多資料傳輸流程,但卻多了許多資料驗證手段。

後端會員身份驗證機制意外的簡單!


也從這個專案中重新獲得許多開發網站的樂趣,能用 DataSnap REST Server 開發網站真是太棒了!


選來選去,還是自己熟悉的,最好!

See also:

沒有留言:

張貼留言

DataSnap REST + JS framework = full stack development (CHT)

ExpressWeb Framework, IntraWeb, UniGUI, Raudus, Elevate Web Builder, Kitto, Delphi MVC Framework... Delphi 這麼多 Web Solution 中,你用過哪幾種? ...