8. Java Server Faces Grundlagen der Programmierung II (Java)

Transkript

1 8. Java Server Faces Grundlagen der Programmierung II (Java) Prof. Dr. Bernhard Humm Hochschule Darmstadt University of Applied Sciences Sommersemester 2006

2 Übersicht Grundlagen der Programmierung II Einordnung in den Kontext der Vorlesung Anwendungsentwicklung (Referenzarchitektur, Softwarekategorien) Anwendungs-Komponenten (Anwendungskern) Datenbankzugriff Graphische Benutzeroberflächen (Swing, JSF) Client- / Serverkommunikation (RMI) Berechtigungsverwaltung Application Server (EJB) Erweiterte Konzepte (Reflection, Threads, Design Patterns, ) Hochschule Darmstadt University of Applied Sciences. Fachbereich Informatik. Prof. Dr. Bernhard Humm. Sommersemester 2006., , Seite 2

3 Agenda Agenda JSF: User Interfaces für für Web-Anwendungen JSF von Außen JSF im Einsatz: Ein Beispiel Fazit und Referenzen Hochschule Darmstadt University of Applied Sciences. Fachbereich Informatik. Prof. Dr. Bernhard Humm. Sommersemester Seite 3

4 JSF: User Interfaces für Web-Anwendungen User Interfaces für Web-Anwendungen Was fast jeder Java-Web-Entwickler sich wünscht, ist ein UI-Framework mit dem Komfort und den Gestaltungsmöglichkeiten von Swing Genauer: Smart Client ohne Scripting-Chaos, dafür aber mit GUI- Komponenten, Support für Dialogsteuerung, Internationalisierung,... Derzeit exisitiert ein ganzer Zoo von UI-Frameworks für Web- Anwendungen auf dem Markt (WingS, XUL, Tapestry,...) Jedes dieser Frameworks funktioniert anders, alle erzeugen aber irgendwann mal HTML (oder eine andere Markup-Sprache) Einige davon bringen (meist proprietäre) Tool-Unterstützung mit Hochschule Darmstadt University of Applied Sciences. Fachbereich Informatik. Prof. Dr. Bernhard Humm. Sommersemester 2006., , Seite 4

5 JSF: User Interfaces für Web-Anwendungen User Interfaces für Web-Anwendungen Was man sich also zusätzlich wünscht, ist ein Standard, der eine saubere Basis-Architektur hat für einfache Anwendungen einfach benutzbar ist mit vorhandenen Web-Frameworks interagiert und integriert eine solide Basis für Tool-Unterstützung liefert und... sich durchsetzt! Hochschule Darmstadt University of Applied Sciences. Fachbereich Informatik. Prof. Dr. Bernhard Humm. Sommersemester 2006., , Seite 5

6 JSF: User Interfaces für Web-Anwendungen User Interfaces für Web-Anwendungen Nachdem Microsoft es mit den.net-webforms vorgemacht hat, hat Sun das Problem auch endlich erkannt und JSF geschaffen Im September 2002 wurde der Java Specification Request (JSR) 127 in den Java Community Process (JCP) eingebracht Im März 2004 wurde der Final Release der Spezifikation von JSF 1.0 veröffentlicht Die Referenzimplementierung ist bereits in J2EE 1.4 integriert Alternative Implementierungen sind bereits im Gange Achtung: JSF ist ein UI-Framework für Web-Anwendungen. Es erhebt nicht den Anspruch ein Applikations-Framework zu sein. Kann aber konzeptionell mit Applikations-Frameworks integriert werden. Hochschule Darmstadt University of Applied Sciences. Fachbereich Informatik. Prof. Dr. Bernhard Humm. Sommersemester 2006., , Seite 6

7 Agenda Agenda JSF: User Interfaces für Web-Anwendungen JSF von Außen JSF im Einsatz: Ein Beispiel Fazit und Referenzen Hochschule Darmstadt University of Applied Sciences. Fachbereich Informatik. Prof. Dr. Bernhard Humm. Sommersemester Seite 7

8 JSF von Außen Der Technologiestack von JSF JSF basierte Applikation JSF Taglibs JSP API JSF API Servlet API HTML XML Java JSF (Java Server Faces): Standard Web UI Technologie nach MVC Taglib: Bibliothek für JSP-Tags zur Minimierung des Java-Codes in JSPs JSP (Java Server Pages): Java-Code in HTML-Seiten eingebettet Servlet: Klassenbibliothek zum Empfangen von HTTP-Requests und Generieren von HTML-Seiten HTML (Hypertext Markup Language): Darstellung von Web-Inhalten XML (Extensible Markup Language): Metasprache zur Definition von Auszeichungssprachen Hochschule Darmstadt University of Applied Sciences. Fachbereich Informatik. Prof. Dr. Bernhard Humm. Sommersemester 2006., , Seite 8

9 JSF von Außen Ein Komponentenmodell für User Interfaces JSF besteht aus drei wesentlichen Bestandteilen Die JSF-Komponenten serverseitig implementierte UI- Komponenten unterstützt durch Event-Listener, Validatoren und Konverter Die JSF-Taglibs zur Abbildung der Komponenten in eine Scripting-Sprache (Java Server Pages) Das Eventmodell und der definierte JSF- View-Lebenszyklus Browser Access page HTTPRequest Return Content HTTP Response WebContainer Page UI Component JSF basierte Applikation JSF Taglibs JSP API Servlet API JSF API Hochschule Darmstadt University of Applied Sciences. Fachbereich Informatik. Prof. Dr. Bernhard Humm. Sommersemester 2006., , Seite 9

10 JSF von Außen MVC fürs Web JSF basiert (natürlich) auf dem MVC-Pattern... Model View Controller Browser Access page HTTPRequest Return Content HTTP Response WebContainer Page UICom ponent Also: Saubere Trennung zwischen Zustand, Verhalten und Darstellung Application Infrastructure Render Kit Renderer UI Components Page (JSP) JSF Taglib <h:commandbutton id="submit" action="success value="submit" /> Listeners Navigation Validators Converters Backing Java Beans Hochschule Darmstadt University of Applied Sciences. Fachbereich Informatik. Prof. Dr. Bernhard Humm. Sommersemester 2006., , Seite 10

11 JSF von Außen Plug&Play...und so gut wie alles an JSF ist pluggable, erweiterbar und konfigurierbar Infrastrukturklassen (Application etc.) Renderer, Renderkits UI-Komponenten Konverter und Validatoren Listener Navigation Resourcen Aber: Das macht es natürlich auch komplex (siehe Swing) Render Kit Resource Bundle Application Infrastructure faces-config.xml UI Components Navigation Handler Listeners Validators Converters Hochschule Darmstadt University of Applied Sciences. Fachbereich Informatik. Prof. Dr. Bernhard Humm. Sommersemester 2006., , Seite 11

12 JSF von Außen UI-Komponenten UICommand UIViewRoot UIPanel UIComponent UIComponentBase UINaming Container UIForm UIOutput UISelect Items UISelect Item UIInput UIData UIColumn UIGraphic UISelect Boolean UISelect One UISelect Many UIPara meter UIMessages UIMessage Hochschule Darmstadt University of Applied Sciences. Fachbereich Informatik. Prof. Dr. Bernhard Humm. Sommersemester 2006., , Seite 12

13 JSF von Außen UI-Komponenten UICommand Represents a control that fires actions when activated. UIViewRoot Represents the root of the component tree. UIPanel Manages the layout of its child components. UINamingContainer Container für die strukturierte Benennung von Kindkomponenten UIForm Group of controls that submit data to the application. Analogous to <form> tag in HTML. UIOutput UIInput UISelectBoolean UISelectOne UISelectMany UISelectItem UISelectItems UIData UIColumn UIMessage UIMessages UIGraphic UIParameter Displays data output on a page. Takes data input from a user. This class is a subclass of UIOutput. Set a boolean value on a control by selecting or deselecting it. Subclass of UIInput. Select one item from a group of items. Subclass of UIInput. Select multiple items from a group of items. Subclass of UIInput. Represents a single item in a set of items. Nested in UISelectOne or UISelectMany. Represents an entire set of items. Nested in UISelectOne or UISelectMany. Represents a tabular collection of data represented by a DataModel instance. Represents a single column of data in a UIData component. Displays a localized message. Displays a set of localized messages. Displays an image. Represents substitution parameters. Hochschule Darmstadt University of Applied Sciences. Fachbereich Informatik. Prof. Dr. Bernhard Humm. Sommersemester 2006., , Seite 13

14 JSF von Außen Entwicklungsprozess Für eine einfache JSF-Anwendung ergeben sich folgende Entwicklungsschritte: Entwicklung der Datenmodell-Schnittstelle in Form von Backing-Beans Deklaration der Backing-Beans im Applikations-Konfigurationsfile Erzeugen der Präsentations-Seiten mit Hilfe der JSF Tag-Libraries Definieren der Seitennavigation im Applikations-Konfigurationsfile Hochschule Darmstadt University of Applied Sciences. Fachbereich Informatik. Prof. Dr. Bernhard Humm. Sommersemester 2006., , Seite 14

15 JSF von Außen Entwicklungsprozess Für komplexere JSF-Anwendungen kommen ggf. noch folgende Entwicklungsschritte hinzu: Implementieren und Einbinden von eigenen Listenern für erweiterte (datenabhängige) Dialogsteuerung und umfangreichere Datenzugriffe und Verarbeitungslogik Implementieren eigener Validatoren und Konverter für komplexe Datentypen Erweiterung bzw. Eigenentwicklung von UI-Komponenten, inclusive dazugehöriger Tags und Renderer Hochschule Darmstadt University of Applied Sciences. Fachbereich Informatik. Prof. Dr. Bernhard Humm. Sommersemester 2006., , Seite 15

16 Agenda Agenda JSF: User Interfaces für Web-Anwendungen JSF von Außen JSF im Einsatz: Ein ein Beispiel Fazit und Referenzen Hochschule Darmstadt University of Applied Sciences. Fachbereich Informatik. Prof. Dr. Bernhard Humm. Sommersemester Seite 16

17 JSF im Einsatz: ein Beispiel Ein Beispiel: Expense Reports Hochschule Darmstadt University of Applied Sciences. Fachbereich Informatik. Prof. Dr. Bernhard Humm. Sommersemester 2006., , Seite 17

18 JSF im Einsatz: ein Beispiel Ein Beispiel: ExpenseReports Quelle: Hans Bergsten, Java Server Faces (O Reilly 2004) Einfache Verwaltung von Spesenabrechnungen Benutzerprofile Angestellter und Manager mit unterschiedlichen Zugriffsrechten Erstellung und Prüfung von Spesenabrechnungen Umfasst alle wesentlichen Aspekte der Anwendungsentwicklung mit Java Server Faces Deployed in Apache Tomcat 5.0 Hochschule Darmstadt University of Applied Sciences. Fachbereich Informatik. Prof. Dr. Bernhard Humm. Sommersemester 2006., , Seite 18

19 JSF im Einsatz: ein Beispiel Dialoge (View): Basiselemente taglib uri="http://java.sun.com/jsf/html" prefix="h"%> taglib uri="http://java.sun.com/jsf/core" prefix="f"%> <f:view> <h:form> <h:outputtext value="#{labels.reporttitlelabel}"/> <h:inputtext id="title" size="30" required="true" value="#{reporthandler.currentreport.title}" /> <h:message for="title" /> <h:outputtext value="#{labels.reportentrylabel}"/> <h:outputtext value="#{labels.reportdatelabel}"/> <h:inputtext id="date" size="8" required="true" value="#{entryhandler.currententry.date}"> <f:convertdatetime datestyle="short" /> </h:inputtext> <h:message for="date" /> ... Ein View entspricht einer Request-Antwort! Hochschule Darmstadt University of Applied Sciences. Fachbereich Informatik. Prof. Dr. Bernhard Humm. Sommersemester 2006., , Seite 19

20 JSF im Einsatz: ein Beispiel Dialoge (View): Basiselemente... <h:outputtext value="#{labels.reporttypelabel}"/> <h:selectonemenu id="type" required="true" value="#{entryhandler.currententry.type}"> <f:selectitems value="#{entryhandler.expensetypechoices}"/> </h:selectonemenu> <h:message for="type" /> <h:outputtext value="#{labels.reportamountlabel}"/> <h:inputtext id="amount" size="8" required="true" value="#{entryhandler.currententry.amount}"> <f:convertnumber pattern="#,##0.00" /> <f:validatedoublerange minimum="1"/> </h:inputtext> <h:message for="amount" /> <h:commandbutton value="add" disabled="#{reporthandler.editdisabled}"/> </h:form> </f:view> Hochschule Darmstadt University of Applied Sciences. Fachbereich Informatik. Prof. Dr. Bernhard Humm. Sommersemester 2006., , Seite 20

21 JSF im Einsatz: ein Beispiel Navigation (Controller) Die Dialogsteuerung ist über ein Automatenmodell im Applications- Konfigurationsfile konfigurierbar Der Navigation Handler ermittelt über die von den ActionListenern gelieferten Tags den Folgedialog Hochschule Darmstadt University of Applied Sciences. Fachbereich Informatik. Prof. Dr. Bernhard Humm. Sommersemester 2006., , Seite 21

22 JSF im Einsatz: ein Beispiel Navigation (Controller) <navigation-rule> <from-view-id>/reports.jsp</from-view-id> <navigation-case> <from-action> #{userhandler.editprofile} <from-outcome>success</from-outcome> <to-view-id>/preferences.jsp</to-view-id> </navigation-case> </navigation-rule> <navigation-rule> <from-view-id>/preferences.jsp</from-view-id> <navigation-case> <from-action> #{userhandler.updateprofile} </from-action> <from-outcome>success</from-outcome> <to-view-id>/reports.jsp</to-view-id> </navigation-case> </navigation-rule> <h:commandlink id="preferences" action ="#{userhandler.editprofile}" value="preferences" /> <h:commandbutton id="updateprofile" action="#{userhandler.updateprofile}" value="updateprofile" /> Hochschule Darmstadt University of Applied Sciences. Fachbereich Informatik. Prof. Dr. Bernhard Humm. Sommersemester 2006., , Seite 22

23 JSF im Einsatz: ein Beispiel Zugriff auf Anwendungslogik (Model): Backing Beans <h:datatable value="#{reporthandler.sortedreportsmodel}"......> public class ReportHandler {... private DataModel reportsmodel; public DataModel getsortedreportsmodel() { if (reportsmodel == null) { reportsmodel = new ListDataModel(); } List reports = getreports(); sortreports(reports); reportsmodel.setwrappeddata(reports); return reportsmodel; }... } Backing Beans dienen als Adapter zwischen JSF und der Anwendungslogik Sind aber nur sauberes Design, kein Bestandteil der Spezifikation JSF-DataModel-Klasse zur Unterstützung für Tabellen wrappt Arrays, Listen und SQL-Resultsets Hochschule Darmstadt University of Applied Sciences. Fachbereich Informatik. Prof. Dr. Bernhard Humm. Sommersemester 2006., , Seite 23

24 Zugriff auf Anwendungslogik (Model): Beans- Deklarationen JSF im Einsatz: ein Beispiel <managed-bean> <managed-bean-name>reporthandler</managed-bean-name> <managed-bean-class> com.mycompany.expense.reporthandler </managed-bean-class> <managed-bean-scope>session</managed-bean-scope> <managed-property> <property-name>reportregistry</property-name> <value>#{reportregistry}</value> </managed-property> </managed-bean> <managed-bean> <managed-bean-name>reportregistry</managed-bean-name> <managed-bean-class> com.mycompany.expense.filereportregistry </managed-bean-class> <managed-bean-scope>application</managed-bean-scope> </managed-bean> Deklaration verwendeter Java-Beans Lebensdauer bzw. Sichtbarkeit über Scope (Request, Session, Application) Vorbelegung der Bean- Properties mit Default- Werten Durch Schachtelung können komplette Bean- Strukturen deklarativ aufgebaut werden Hochschule Darmstadt University of Applied Sciences. Fachbereich Informatik. Prof. Dr. Bernhard Humm. Sommersemester 2006., , Seite 24

25 Agenda Agenda JSF: User Interfaces für Web-Anwendungen JSF von Außen JSF im Einsatz: Ein Beispiel Fazit und Referenzen Hochschule Darmstadt University of Applied Sciences. Fachbereich Informatik. Prof. Dr. Bernhard Humm. Sommersemester Seite 25

26 Fazit und Referenzen Fazit JSF ist analog Swing sehr komplex und erfordert intensive Einarbeitung Das Programmiermodell von Swing wurde aber nicht 100% adaptiert JSF wir häufig falsch wahrgenommen, nämlich als Allheilmittel und Garantie für hochwertige Web-Anwendungen JSF ist ein UI-Framework, kein Application-Framework, diesem Anspruch wird es gerecht JSF hat eine saubere Architektur und eine brauchbare Referenzimplementierung JSF ist integrativ und sollte sich relativ einfach in andere Frameworks einfügen JSF ist sehr flexibel, da so gut wie alles pluggable oder konfigurierbar ist JSF ist auf dem Weg, als Standard akzeptiert zu werden Hochschule Darmstadt University of Applied Sciences. Fachbereich Informatik. Prof. Dr. Bernhard Humm. Sommersemester 2006., , Seite 26

27 Fazit und Referenzen Alternative Implementierungen ECruiser: Implementierung des 1.0-Standards mit erweiterter Komponentenbiliothek The Keel Meta-Framework: Integrationsframework für mehrere Open- Source Projekte (Avalon, Cocoon, Struts, JBoss, Turbine,...) und seit neuestem auch JSF MyFaces: Erste Open-Source Vollimplementierung des Standars, ebenfalls mit erweiterter Komponentenbibliothek mit Fancy- Komponenten (Kalender, Tabbed Pane,...) smile: Componente only approach, Open-Source Implementierung 4 mit eigener Designer-Anwendung aber ohne JSP-Tags Resourcen: Hochschule Darmstadt University of Applied Sciences. Fachbereich Informatik. Prof. Dr. Bernhard Humm. Sommersemester 2006., , Seite 27

28 Fazit und Referenzen Komponenten jsfcomp: Komponentenbibliothek für E-Business-Anwendungen WebGalileo Faces Components: Komponentenbibliothek mit Swing- Like Komponenten (TabbedPanel, Toolbar, Menu, Tree, Table) WebTree, WebMenu, WebGrid : Luxus-Komponenten für Bäume, Menüs und Tabellenverarbeitung Resourcen: Hochschule Darmstadt University of Applied Sciences. Fachbereich Informatik. Prof. Dr. Bernhard Humm. Sommersemester 2006., , Seite 28

29 Fazit und Referenzen Entwicklungsunterstützung durch Tools Integrated Development Environents Eclipse based: Eclipse Web Tools JSF, MyEclipse, Exadel JSFStudio, IBM WebSphere Studio Application Developer Sun Java Studio Creator Oracle JDeveloper IDE-Plugins Fast alle IDEs: Java Server Faces Console NetBeans/Sun One Studio: Kobrix WebFaces Resourcen: Hochschule Darmstadt University of Applied Sciences. Fachbereich Informatik. Prof. Dr. Bernhard Humm. Sommersemester 2006., , Seite 29

30 Fazit und Referenzen Quellen und Literatur Literatur und Artikel Hans Bergsten: Java Server Faces, Building web-based user interfaces (O Reilly 2004) Sun Microsystems, The J2EE 1.4 Tutorial (http://java.sun.com/j2ee/1.4/docs/tutorial/doc/index.html) Sun Microsystems, Introducing JSF Technology (http://java.sun.com/developer/ejtechtips/2004/tt0324.html#2 ) Sun Microsystems, Java Server Faces Specification, Final Release 1.0 (http://jcp.org/aboutjava/communityprocess/final/jsr127/) Kai Zaunick: Gut zu Gesicht, Java Server Faces (Java Spektrum 1/2004) (http://www.sigs.de/publications/js/2004/01/zaunick_js_01_04.pdf) Hans Bergsten: Improving JSF by dumping JSP (http://www.onjava.com/pub/a/onjava/2004/06/09/jsf.html) Resourcen Sun Developer Network: Sun Java Server Faces Forum: JSFCentral: James Holmes: Hochschule Darmstadt University of Applied Sciences. Fachbereich Informatik. Prof. Dr. Bernhard Humm. Sommersemester 2006., , Seite 30