ZK Framework - Introduction Part 1

Overview

Merupakan sebuah Framework Front-End untuk membuat application web java. ZK Framework ini ada 2 jenis/versi, yaitu versi Comumnity Edition (ZK CE) dan Enterprise Edition (ZK EE) perbedaan dari kedua versi tersebut diantaranya adalah pada performance dan beberapa fitur. Sejauh ini saya hanya pernah menggunakan/mengimplement versi ZK CE, jadi untuk lebih detailnya perbedaan dari kedua versi tersebut bisa dilihat pada http://www.zkoss.org/whyzk/Features

Pada ZK ada istilah yang disebut dengan ZUML yaitu kepanjangan dari ZK User Interface Markup Language yang berbasis XML. ZUML ini digunakan pada file ZK, yang memiliki ektensi .zul. File inilah yang nantinya akan di tampilkan pada browser.

Kelebihan dari ZK ini diantaranya adalah:

Support untuk sebuah system MCV. Lingkup dari ZK ini adalah pada bagian view dan controller, jadi bisa dengan mudah di implement dengan framework lain pada bagian Model/Persistance. Tetapi kelebihan yang paling dirasakan adalah memudahkan seorang programmer java dalam mendevelop application web, karena tidak perlu berurusan dengan javascript, html dan css, semua sudah tinggal pakai.

Preparation

Oke selanjutnya kita akan membahas hal-hal yang perlu dipersiapkan untuk bisa memulai development menggunakan ZK. Environment yang diperlukan untuk bisa mendevelope dan menggunakan ZK adalah sbb:

1. Sebuah Application server seperti tomcat, jetty, glass fish, dan lainnya.
2. Eclipse IDE, karena tersedia plugin untuk ZK yang bernama ZK Studio. ZK Studio bisa di install pada eclipse melalui Marketplace Eclipse






3. Dan yang terakhir adalah Maven Archetype untuk project ZK, ini diperlukan untuk project yang menggunakan Maven (http://maven.apache.org/). Maven Archetype bisa di tambahkan melalui: Preference > Maven > Archetype dengan mengisi field catalog file dengan link berikut ==> http://mavensync.zkoss.org/maven2/

Akhirnya persiapan sudah beres, dan selajutnya kita bisa memulai development ZK menggunakan Eclipse.

Create Project ZK

Kita akan membuat sebuah project Maven ZK, dengan cara klik menu File > New > Maven Project.
Selanjutnya pada bagian 'Select an Archetype' set Catalog ZK Maven Archetype dan pilih zk-archetype-webapp

setelah project ter-create, akan terlihat struktur project seperti berikut:

Hello World...

Dalam dunia programming, kalimat perkenalan yang biasanya digunakan saat belajar sebuah teknologi baru adalah Hello World. Maka dari itu kita akan membuat sebuah Hello World pada ZK.

Buka dan edit file index.zul yang berada dalam webapp menjadi seperti berikut:

<?page title="Hello world" contentType="text/html;charset=UTF-8"?>
<zk>
    <window border="normal">
        <label value="Hello World" />
    </window>
</zk>

Compile project maven tersebut menjadi file war, dan deploy pada application server.
Kemudian akses melalui browser dengan url <url-server-local>/nama_file_war, contohnya: 127.0.0.1:8080/zkoss/
Dan hasilnya akan seperti berikut:

Yak cukup sekian dulu introduction ZK Framework part 1,
Silahkan dilanjut ke Part 2