ZK 是一個基於Java EE 與AJAX 的使用者介面框架(UI framework)，它提供上百個元件讓你打造快速反應的網頁應用程式(web application)的介面，每個元件透過AJAX 跟伺服器 ... ... <看更多>
「zk ajax」的推薦目錄：
- 關於zk ajax 在 [J2EE] about zk - 看板java - 批踢踢實業坊 的評價
- 關於zk ajax 在 book 的評價
- 關於zk ajax 在 講者朱祁源是Potix Corporation 的軟體工程師，目前在ZK ... 的評價
- 關於zk ajax 在 zkoss/zk: ZK is a highly productive Java framework ... - GitHub 的評價
- 關於zk ajax 在 org.zkoss.zk.device.DeviceNotFoundException: ajax not found 的評價
- 關於zk ajax 在 iDempiere - ZK Ajax Master Detail layout - YouTube 的評價
zk ajax 在 講者朱祁源是Potix Corporation 的軟體工程師，目前在ZK ... 的推薦與評價
講者朱祁源是Potix Corporation 的軟體工程師，目前在ZK Team 工作。 ZK 是一套以Ajax/XUL/Java 為基礎的網頁應用程式開發框架，可以讓開發者在完全不撰寫Javascript ... ... <看更多>
zk ajax 在 zkoss/zk: ZK is a highly productive Java framework ... - GitHub 的推薦與評價
ZK is renowned for its "Ajax without JavaScript" approach since 2005, enabling developers to build rich internet applications transparently without any ... ... <看更多>
zk ajax 在 iDempiere - ZK Ajax Master Detail layout - YouTube 的推薦與評價
iDempiere - is the Best Free ERP using OSGi with ZK Ajax Master Detail enhancements that allows user friendly control over the look and feel ... ... <看更多>
zk ajax 在 [J2EE] about zk - 看板java - 批踢踢實業坊 的推薦與評價
最近因為在學習 zk ，所謂學而不思則惘，一直想來寫點介紹文，
順便找點同好聊聊，開個討論串來討論討論這個主軸帶點討論風氣。
對於 zk 我目前因為接觸不深，還是比較難用比較完整的角度來陳述，
因為 zk 本質上是一個在各個細節都非常注重的東西，
每個小細節幾乎都可以開一個主題，
有些東西我也是才疏學淺，還有待大家一起討論研究。
畢竟這是一個試圖在 web 世界中，做出一個 ajax solution 的framework。
-----------------------------------------------------
所以我打算先以完全沒接觸過的使用者的觀點，寫一寫我接觸時眼中的zk。
這篇的主軸一半的背景知識會是web(html+javascript+css)，
另一半則是 J2EE (Java/servlet/container(tomcat)) 等。
zk 最早給我的印象是他是個在國外比較紅的 framework ，
另外就是它是個 ajax framework 。
-----------------------------------------------------
對，我們的話題就從 ajax framework 開始。
-----------------------------------------------------
我的 ajax 領域經驗雖然還不算深，
但也曾經接觸過一些 ajax 應用專案，參與過其中的流程開發，
曾有過一些經驗，我很難想像，ajax 怎麼可能能夠做得成模組化？
畢竟幾乎每個 request 都是需要自己去設計規格，
去掌握每個 param 的傳遞，回來自己動手做每件後續的處理，
回傳到頁面時自己掌握前端的頁面呈現。
就算我們用 struts 來管理破碎頁面的呈現，
或者是像ruby 語言的 RoR 這種提供豐富環境支援的環境，
要做到 ajax 的模組化跟架構化，一直都是一個很困難的事情。
而我們搞 F2E (Front-to-End 網頁前端技術）的人，
整天和 javascript/css 打交道，
最麻煩的就是隨時要在 server /client 兩個不同領域繞來繞去。
我一向要煩惱 db 要怎麼撈資料，他會噴什麼資料給我，
另一邊要煩惱行為畫面應該要怎麼做，才能符合案主需求。
而且很多時候其實我會用到很多重複的零組件，
其中最經典的莫過於就是表單驗證了，我很早就為此寫過一隻小lib。
#15v04i62(ajax)
或者是一些諸如日期選單、tabbox 等等。
看看每天在 web_design/ajax 討論 plug-in 的類型跟用途的人，
跟一堆討論要怎麼透過javascript 操作資料的人，
就不難發現其實很多東西是一再被提到、被用到，
一再的在我們的開發工作中出現的東西。
-----------------------------------------------------
zk 本質上就是一個 base on J2EE 的架構，
如果你 deploy 過 struts 或者一些 J2EE web framework，
它就跟他們一樣，有一些 jar檔。（你可以在zk官方網站上下載）
https://www.zkoss.org
你可以 build 一個 zk web application ，
透過建立一個 webapp ，放到 tomcat底下的webapps資料夾，
設定好 context ，把 zk 的 jar 丟到 WEB-INF/lib 。
把 server 開起來， ok ，你現在就有一個 zk 的環境了。
就像是正常的 J2EE project 一樣，更簡單的方式是拿一個包好的 war 檔，
丟到 web apps 資料夾，讓 tomcat 自己佈署。
我要表達的是，只要你寫過其他 J2EE project ，
那 zk 在架設跟佈署上是差不多的。
如果你沒寫過 J2EE 的 project ，那應該也沒關係，
網路上有很多參考資料，而且官方也有文件，雖然說都是英文的。XD
-----------------------------------------------------
在我們「概念上」的佈署完一個 project 之後，
zk 在實務開發時，主要會透過撰寫 "zul" 檔來進行開發。
這個 zul 檔類比到一般的 J2EE application ，
就可說等於是 JSP 的角色，他會負責外觀的呈現跟一些事件的處理。
他是一個 xml 檔，就跟一般的 html 一樣是採用一堆 <xxx> 的 tag 格式，
基本上進入 zk 的第一個門檻大多會出現在 zul 的學習上，
因為你能用的 tag 主要是由 zk 定義給你的。
（當然zk 非常貼心的，基本的 div / label 等等，該有的都有。）
一個簡單的範例可以幫助我們快速進入狀況
<zk>
<label value="hello world" />
</zk>
-----------------------------------------------------
這樣會轉譯成這樣的 html ：
<span id="z_rrk_01" class="z-label">hello world</span>
-----------------------------------------------------
夠簡單的 hello world 吧。XD
基本上因為一開始學 zul ，我在很多的 component 中一直迷惑，
我到底要用哪些，所以在這裡我打算先點出幾個常用的經典 component 。
資料呈現方面
-----------------------------------------------------
<label value="文字" /> 簡單的 span 就是個文字呈現
-----------------------------------------------------
<div> div 這老傢伙不用解釋了吧 - -;;
就跟一般的網頁div是一樣的。
<label value="文字" />
<label value="文字" />
</div>
-----------------------------------------------------
<grid> 強化版的表格 詳細範例可看下列連結
https://www.zkoss.org/zksandbox/userguide/#g2
中間有個「view source」，打開來可以看到原始碼，
也可以修改原始碼，再按下下面的 try-it 即時體驗。
-----------------------------------------------------
表單方面也有一些常用元件
https://www.zkoss.org/zksandbox/userguide/#f2
你能想到的 textbox / password / datebox (內建有日期選單的input) ,
還有限定輸入資料型態的 intbox longbox 等。
當然也有下拉選單 combobox 、 radio、button等
其實遠不只這些啦，zk component 沒仔細數過，應該有幾十個上百個吧，
這只是如果說要我介紹你前十個，我會先講這些。
事實上還有一些很 powerful 的排版功能，
像是 tabbox ， hbox/vbox 系列等。
-----------------------------------------------------
本來是想一路寫到為什麼可以簡化 ajax problem ，
不過沒想到寫到這就快十二點了，所以先暫時收尾在這邊，
剩下的暫時先說下集待續。
在這裡我們目前已經介紹到 zk 透過自定義的 component 跟格式，
來進行 ui 的呈現，眼尖的夥伴們應該也已經發現，
前面範例中有一些像是 datebox 這類的元件是結合 javascript 的操作的。
也就是說，所謂的 component 其實就是預先定義好的 html+css+ js邏輯，
所以在大多數假設中的狀況下，你大多可以找到一個zk提供的功能，
來作到你想要的操作，而不一定需要自己另外寫程式來處理。
而 zk 的元件都走 css 風格，除非必須配合 javascript 設定的屬性，
否則一律都是走 css 風格，你也可以採用定義自己的css的方式蓋掉他。
或者是寫一個自己的 component ，
甚至是 zk 也有提供讓你在 zul 中寫原本的html tag 的貼心設計。
寫 zul 要像是寫原本的 html 也是完全做的到的。
-----------------------------------------------------
在常用元件的部份，zk提供一些有趣的組件，但由於篇幅跟時間的關係，
對於 component 的介紹或許拉到之後比較後面討論到深入的實做時再講。
下一篇要提到為什麼能夠因此簡化 ajax 、頁面呈現的操作，
跟一些常見的網頁事件的處理該如何進行，我覺得這些都是非常有趣的部份。
--
這裡有 zk 自己的官方 demo
https://www.zkoss.org/demo/
我個人會推薦底下這兩個，zk calender 跟zk grid 的有趣應用。:)
https://zcal.zkoss.org/
https://www.zkoss.org/zkdemo/grid/master_detail
--
I am a person, and I am always thinking .
Thinking in love , Thinking in life ,
Thinking in why , Thinking in worth.
I can't believe any of what ,
I am just thinking then thinking ,
but worst of all , most of mine is thinking not actioning...
--
※ 發信站: 批踢踢實業坊(ptt.cc)
◆ From: 111.82.21.118
※ 編輯: TonyQ 來自: 111.82.21.118 (10/05 00:12)
... <看更多>