IS 472 - Pengembangan Aplikasi Enterprise
advertisement
Pertemuan 01: Pengenalan JavaServer Faces
Program Studi Sistem Informasi
Universitas Kristen Maranatha
© 2015 – Niko Ibrahim, MIT
Tujuan Perkuliahan
Mahasiswa memahami dasar-dasar JSF
Tag-tag JSF
Cara kerja Managed Bean
Konfigurasi JSF (faces-config.xml)
Konfigurasi aplikasi web (web.xml)
Mahasiswa mampu membuat aplikasi sederhana
menggunakan JSF
Materi Pembahasan
Latar belakang lahirnya JSF
Struktur aplikasi JSF
Tutorial sederhana
Referensi:
Core JAVASERVER™ FACES 3rd Edition, David
Geary, Cay Horstmann, Prentice Hall, 2010
Easy development vs Attractive Platform
Microsoft ASP.NET menyediakan fasilitas RAD
(Rapid Application Development) melalui visual
studio
Java EE terkenal sebagai platform yang high
scalable, multiplatform, lots of vendor support.
Namun, masih menganut style “hard-core
coding”
The promise of JSF
To bring rapid user interface development to
serverside Java.
JSF dapat dianalogikan sebagai “Swing untuk
aplikasi web”
JSF menyediakan suatu framework untuk
melakukan page-navigation, validasi data,
konversi data, dll
JSF memungkinkan developer untuk
menggunakan tools (IDE) dalam mendesain
secara visual maupun coding biasa.
JSF merupakan bagian standar dari Java EE
3 Bagian Utama dari JSF
Berbagai komponen user interface siap pakai
(button, panel, data grid, tree, menu, dll)
Event-driven programming model
Component model yang memungkinkan thirdparty developer menyediakan komponen
tambahan
Tools & Library required
JDK 6.0 or higher
Library JSF 2
GlassFish Application Server
NetBeans 8 IDE
Struktur Direktori applikasi JSF
Aplikasi JSF dideploy sebagai file WAR (zip file
dengan ekstensi .war) dan memiliki struktur
standar sbb:
Bagian Dasar Aplikasi JSF
1.
2.
3.
Halaman JSF (file dengan ekstensi .xhtml)
Managed Bean (file .java, biasanya dipakai
untuk sinkronisasi data input/output)
Konfigurasi JSF (faces-config.xml)
4.
Navigation rule
Pendefinisian managed bean, dll.
Konfigurasi Servlet (web.xml)
PEMBAHASAN BAGIAN-BAGIAN
JSF
1. Halaman JSF
Halaman JSF berfungsi sebagai antarmuka
aplikasi (frontend).
Biasanya memiliki ekstensi .jsp atau .jsf
atau.xhtml
Harus memiliki deklarasi tag yang akan
digunakan pada halaman JSF tsb.
Contoh:
<html
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core">
Contoh Halaman JSF (index.xhtml)
1. <html xmlns=http://www.w3.org/1999/xhtml
2.
xmlns:h="http://java.sun.com/jsf/html"
Deklarasi Tag
3.
xmlns:f="http://java.sun.com/jsf/core">
4.
Merender
5. <f:view>
tampilan/view
6. <head>
7. <title>Hello JSF!</title>
8. </head>
9. <body>
HTML Form
10. <h:form>
11.
Please enter your name and password here <br/>
12.
Name: <h:inputText value="#{HelloBean.name}"/> <br/>
Field input
13.
Password: <h:inputSecret value="#{HelloBean.password}"/> <br/>
14.
<h:commandButton value="Login" action=“output"/>
Button
15. </h:form>
16. </body>
17. </f:view>
18. </html>
Halaman JSF (continue)
Name: <h:inputText value="#{HelloBean.name}"/> <br/>
#{HelloBean.name} menyambungkan halaman JSF ke
sebuah objek Java yaitu: objek HelloBean, dan property
name
<h:commandButton value="Login" action=“output"/>
action=“output” menyatakan bahwa apabila tombol ini
diklik maka akan memanggil response page yaitu
“output.xhtml”
Halaman JSF (output.xhtml)
1. <html xmlns="http://www.w3.org/1999/xhtml"
2.
xmlns:h="http://java.sun.com/jsf/html">
3. <h:head>
4.
<title>Facelet Title</title>
5. </h:head>
6. <h:body>
7.
Selamat Anda telah berhasil membuat aplikasi Web menggunakan JSF<br/>
8.
Berikut data Anda: <br/>
9.
Name: <h:outputText value="#{HelloBean.name}"/> <br/>
10.
Password: <h:outputText value="#{HelloBean.password}"/> <br/>
11. </h:body>
12. </html>
Java Bean & Managed Bean
Java Bean adalah suatu class Java biasa yang
memiliki aturan penulisan tertentu/baku, di
antaranya yaitu:
Merupakan public class
Semua property memiliki private scope
Akses terhadap property dilakukan melalui getter/setter
method
Managed Bean adalah suatu class Java Bean
yang digunakan untuk me-manage data
input/output yang ada di dalam halaman JSF
Contoh Managed Bean:
HelloBean.java
Nama package
1. package com.pwl;
2.
Nama Bean
3. public class HelloBean {
4. private String name;
Property
5. private String password;
6.
7. // PROPERTY: name
getter/setter methods
8. public String getName() { return name; }
9. public void setName(String newValue) { name = newValue; }
10.
11. // PROPERTY: password
12. public String getPassword() { return password; }
13. public void setPassword(String newValue) { password = newValue; }
14. }
Pendefinisian Managed Bean
@ManagedBean (name="HelloBean")
public class HelloBean {….}
Pemanggilan managed bean pada index.xhtml:
Name: <h:inputText value="#{HelloBean.name}"/> <br/>
Password: <h:inputSecret value="#{HelloBean.password}"/> <br/>
Penggunaan Tools / IDE
JSF didesain sedemikian rupa agar kita dapat
memanfaatkan tools/IDE dalam men-develop
aplikasi.
Dengan menggunakan IDE, kita dapat mendesain
secara visual maupun coding biasa
Beberapa tools yang dapat digunakan:
NetBeans
Eclipse
Exadel Studio
JBoss Developer Studio
IntelliJ IDEA, dll.
Library JSF – third party
RichFaces: http://www.richfaces.org
IceFaces: http://www.icefaces.org
PrimeFaces: http://www.primefaces.org
MyFaces: http://myfaces.apache.org
Kesimpulan
Dengan menggunakan JSF, kita dapat memadukan
antara kemudahan dalam membuat aplikasi dan
kehandalan Java EE
JSF merupakan framework pengembangan aplikasi
Web yang menyediakan:
Sekumpulan komponen user interface
Event-driven programming model
Component model
Aplikasi standar JSF terdiri dari:
Halaman JSF
Java/Managed Bean
File konfigurasi (optional)
What NeXT
Mengerjakan tutorial membuat aplikasi JSF
sederhana menggunakan NetBeans
Tutorial ini menggunakan JSF versi 2
Ikuti: Tutorial JSF Bagian 1.pdf
