Pertemuan 01: Pengenalan JavaServer Faces. Program Studi Sistem Informasi Universitas Kristen Maranatha 2015 Niko Ibrahim, MIT

Ukuran: px

Mulai penontonan dengan halaman:

Download "Pertemuan 01: Pengenalan JavaServer Faces. Program Studi Sistem Informasi Universitas Kristen Maranatha 2015 Niko Ibrahim, MIT"

Handoko Darmadi
7 tahun lalu
Tontonan:

1 Pertemuan 01: Pengenalan JavaServer Faces Program Studi Sistem Informasi Universitas Kristen Maranatha 2015 Niko Ibrahim, MIT

2 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

3 Materi Pembahasan Latar belakang lahirnya JSF Struktur aplikasi JSF Tutorial sederhana Referensi: Core JAVASERVER FACES 3 rd Edition, David Geary, Cay Horstmann, Prentice Hall, 2010

4 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

5 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

6 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

7 Tools & Library required JDK 6.0 or higher Library JSF 2 GlassFish Application Server NetBeans 8 IDE

8 Struktur Direktori applikasi JSF Aplikasi JSF dideploy sebagai file WAR (zip file dengan ekstensi.war) dan memiliki struktur standar sbb:

9 Bagian Dasar Aplikasi JSF 1. Halaman JSF (file dengan ekstensi.xhtml) 2. Managed Bean (file.java, biasanya dipakai untuk sinkronisasi data input/output) 3. Konfigurasi JSF (faces-config.xml) Navigation rule Pendefinisian managed bean, dll. 4. Konfigurasi Servlet (web.xml)

10 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=" xmlns:f="

11 Contoh Halaman JSF (index.xhtml) 1. <html xmlns= 2. xmlns:h=" 3. xmlns:f=" <f:view> 6. <head> 7. <title>hello JSF!</title> 8. </head> 9. <body> 10. <h:form> 11. Please enter your name and password here 12. Name: <h:inputtext value="#{hellobean.name}"/> 13. Password: <h:inputsecret value="#{hellobean.password}"/> 14. <h:commandbutton value="login" action= output"/> 15. </h:form> 16. </body> 17. </f:view> 18. </html> Deklarasi Tag Merender tampilan/view HTML Form Field input Button

12 Halaman JSF (continue) Name: <h:inputtext value="#{hellobean.name}"/> #{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

13 Halaman JSF (output.xhtml) 1. <html xmlns=" 2. xmlns:h=" 3. <h:head> 4. <title>facelet Title</title> 5. </h:head> 6. <h:body> 7. Selamat Anda telah berhasil membuat aplikasi Web menggunakan JSF 8. Berikut data Anda: 9. Name: <h:outputtext value="#{hellobean.name}"/> 10. Password: <h:outputtext value="#{hellobean.password}"/> 11. </h:body> 12. </html>

14 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

15 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; // PROPERTY: name 8. public String getname() { return name; } getter/setter methods 9. public void setname(string newvalue) { name = newvalue; } // PROPERTY: password 12. public String getpassword() { return password; } 13. public void setpassword(string newvalue) { password = newvalue; } 14. }

16 Pendefinisian Managed (name="hellobean") public class HelloBean {.} Pemanggilan managed bean pada index.xhtml: Name: <h:inputtext value="#{hellobean.name}"/> Password: <h:inputsecret value="#{hellobean.password}"/>

17 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.

18 Library JSF third party RichFaces: IceFaces: PrimeFaces: MyFaces:

19 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)

20 What NeXT Mengerjakan tutorial membuat aplikasi JSF sederhana menggunakan NetBeans Tutorial ini menggunakan JSF versi 2 Ikuti: Tutorial JSF Bagian 1.pdf

dokumen-dokumen yang mirip

1. Tujuan Mempersiapkan aplikasi JSF menggunakan Netbeans Membuat aplikasi Guest Book sederhana. 2. Latar Belakang JSF LifeCycle

1. Tujuan Mempersiapkan aplikasi JSF menggunakan Netbeans Membuat aplikasi Guest Book sederhana 2. Latar Belakang JSF LifeCycle 1 P age 3. Percobaan Percobaan 1 : Menyiapkan aplikasi project JSF Info Tujuan