Benjamin Schmid
19. Januar 2006

Komponentenorientierte
Webanwendungen mit wingS 2.0
Die Open Source Alternative zu JSF un...
Inhalt
Einleitung
Einleitung
Was ist wingS
Architektur
Applikationserstellung
JSF vs. wingS am Beispiel
Fazit

2

Komponen...
Entwicklungshistorie populärer
Web-Technologien für Java
Seiten-Paradigma

Widgets

H-MVC
Sun JSF
Struts

Tapestry

MVC

J...
Erwartungen an ein
modernes Web-Framework
Höhere Effizienz (Aufwand, Fehlerrate)
Vereinfachung des Entwicklungsprozesses (...
Inhalt
Einleitung
Was ist wingS
Architektur
Applikationserstellung
JSF vs. wingS am Beispiel
Fazit

5

Komponentenorientie...
Was ist wingS?
„wingS is net generation Swing“:
Komponenten- und Eventbasiert
H-MVC – Architektur (schachtelbares MVC)
Pro...
Features von wingS
Umfangreicher Satz an visuellen Komponenten
(Textfields, Buttons, Trees, Tables, Tabbed Panes, Menues)
...
Inhalt
Einleitung
Was ist wingS
Architektur
Applikationserstellung
JSF vs. wingS am Beispiel
Fazit

8

Komponentenorientie...
Die Architektur von wingS

9

Komponentenorientierte Webanwendungen mit wingS 2.0
© eXXcellent solutions gmbh, Benjamin Sc...
Die Architektur von wingS
Jede wingS Komponente hält ihren Zustand innerhalb ihres
Modells
Die wingS Session hält den Komp...
Inhalt
Einleitung
Was ist wingS
Architektur
Applikationserstellung
JSF vs. wingS am Beispiel
Fazit

11

Komponentenorienti...
Applikationserstellung mit wingS
Darstellung
Die visuelle Darstellung der Komponenten bestimmt sich
vorrangig über die Inh...
Darstellung von Komponenten
Inhalte
Verändern der Modellinhalte einer Komponente
label.setText(„Text“)
radioButton.getMode...
Layout-Manager in wingS
Dynamische Layout-Manager
Regelbasierte Anordnung der Komponenten eines Containers
(Tabellenweise,...
Anbindung der Präsentationslogik
Analog zu Swing:
Anbindung der Logik an die wingS Komponenten via Events
Typische Events:...
Inhalt
Einleitung
Was ist wingS
Architektur
Applikationserstellung
JSF vs. wingS am Beispiel
Fazit

16

Komponentenorienti...
Exkurs JSF: Ein einfaches Ratespiel (1)
Eindrücke aus den JavaServer Faces (JSF):
Das Guess-A-Number Beispiel von Sun

Que...
Exkurs JSF: Ein einfaches Ratespiel (2)
Einbinden der Logik via JSF-Tags in die JSP Seite
<%@ taglib uri="http://java.sun....
Exkurs JSF: Ein einfaches Ratespiel (3)
Ablaufsteuerung in JSF via faces-config.xml
<?xml version='1.0' encoding='UTF-8'?>...
Exkurs JSF: Ein einfaches Ratespiel (4)
Prüflogik in JSF als Validator
public void validate(FacesContext context,
if (mini...
Vergleich wingS vs. JSF

21

Komponentenorientierte Webanwendungen mit wingS 2.0
© eXXcellent solutions gmbh, Benjamin Sch...
Das einfache Ratespiel mit wingS

22

Komponentenorientierte Webanwendungen mit wingS 2.0
© eXXcellent solutions gmbh, Ben...
Inhalt
Einleitung
Was ist wingS
Architektur
Applikationserstellung
JSF vs. wingS am Beispiel
Fazit

23

Komponentenorienti...
Gegenüberstellung JSF/wingS: JSF
J2EE Standard
Hohe Öffentlichkeitswirkung
Konzeptionell immer noch JSP/Struts

JavaServer...
Gegenüberstellung JSF/wingS: wingS
„Echtes“ OO-/ Komponentenbasiertes
Design von Webapplikationen durch H-MVC
Hohe Effizie...
Weiterführende Informationen

Ausstellungsbereich Stand 11.3
Benjamin Schmid (B.Schmid@exxcellent.de)
www.j-wings.org
www....
Nächste SlideShare
Wird geladen in …5
×

Komponentenorientierte Webanwendungen mit wingS 2.0

342 Aufrufe

Veröffentlicht am

Die Open Source Alternative zu JSF und Struts

Veröffentlicht in: Technologie
0 Kommentare
0 Gefällt mir
Statistik
Notizen
  • Als Erste(r) kommentieren

  • Gehören Sie zu den Ersten, denen das gefällt!

Keine Downloads
Aufrufe
Aufrufe insgesamt
342
Auf SlideShare
0
Aus Einbettungen
0
Anzahl an Einbettungen
2
Aktionen
Geteilt
0
Downloads
0
Kommentare
0
Gefällt mir
0
Einbettungen 0
Keine Einbettungen

Keine Notizen für die Folie

Komponentenorientierte Webanwendungen mit wingS 2.0

  1. 1. Benjamin Schmid 19. Januar 2006 Komponentenorientierte Webanwendungen mit wingS 2.0 Die Open Source Alternative zu JSF und Struts
  2. 2. Inhalt Einleitung Einleitung Was ist wingS Architektur Applikationserstellung JSF vs. wingS am Beispiel Fazit 2 Komponentenorientierte Webanwendungen mit wingS 2.0 © eXXcellent solutions gmbh, Benjamin Schmid
  3. 3. Entwicklungshistorie populärer Web-Technologien für Java Seiten-Paradigma Widgets H-MVC Sun JSF Struts Tapestry MVC JSP Taglibs HTML/XML JSP XSP Java Servlet API 3 Komponentenorientierte Webanwendungen mit wingS 2.0 © eXXcellent solutions gmbh, Benjamin Schmid Pure Java
  4. 4. Erwartungen an ein modernes Web-Framework Höhere Effizienz (Aufwand, Fehlerrate) Vereinfachung des Entwicklungsprozesses (notwendige Skills) Kapselung und Behandlung technischer Beschränkungen der Web-Plattform Gute Wiederverwendbarkeit durch Komponentenorientierung und Polymorphie Trennung von Logik, Darstellung und Inhalten durch MVC und Event-Orientierung Hoher Abstraktionsgrad für modellorientierte Konzepte (MDA) Eignung für Refactoring und Unit Tests H-MVC Architektur 4 Komponentenorientierte Webanwendungen mit wingS 2.0 © eXXcellent solutions gmbh, Benjamin Schmid
  5. 5. Inhalt Einleitung Was ist wingS Architektur Applikationserstellung JSF vs. wingS am Beispiel Fazit 5 Komponentenorientierte Webanwendungen mit wingS 2.0 © eXXcellent solutions gmbh, Benjamin Schmid
  6. 6. Was ist wingS? „wingS is net generation Swing“: Komponenten- und Eventbasiert H-MVC – Architektur (schachtelbares MVC) Projektziele: Möglichst nahe am Swing Programmiermodell Eigenheiten des Webs im Framework abdecken Schlankheit und Effizienz Einfacher, wiederverwendbarer Anwendungscode Open Source unter LGPL Lizenz Version 1.0 anno 2001 Version 2.0 im Dezember 2005 6 Komponentenorientierte Webanwendungen mit wingS 2.0 © eXXcellent solutions gmbh, Benjamin Schmid
  7. 7. Features von wingS Umfangreicher Satz an visuellen Komponenten (Textfields, Buttons, Trees, Tables, Tabbed Panes, Menues) Leistungsstarke Layout Manager Verwendet Swing Modelle und Events Styling durch komponentenweise generiertes CSS Modulare Renderer (Pluggable Look & Feel) Behandlung von Back Navigation im Browser Neue Features in wingS 2 leichter anpassbares Default Look & Feel Drag & Drop Support Remote Scripting (AJAX) Kontextmenüs, Tooltips und Tastatur-Shortcuts 7 Komponentenorientierte Webanwendungen mit wingS 2.0 © eXXcellent solutions gmbh, Benjamin Schmid
  8. 8. Inhalt Einleitung Was ist wingS Architektur Applikationserstellung JSF vs. wingS am Beispiel Fazit 8 Komponentenorientierte Webanwendungen mit wingS 2.0 © eXXcellent solutions gmbh, Benjamin Schmid
  9. 9. Die Architektur von wingS 9 Komponentenorientierte Webanwendungen mit wingS 2.0 © eXXcellent solutions gmbh, Benjamin Schmid
  10. 10. Die Architektur von wingS Jede wingS Komponente hält ihren Zustand innerhalb ihres Modells Die wingS Session hält den Komponenten-Baum und damit den gesamten Applikationszustand HTTP Anfragen werden als Menge von Low-level Events verstanden und vom Dispatcher an die betroffenen Komponenten verteilt Dort führen Sie zu Modelländerungen und lösen ggf. Applikations-Events aus Danach übernimmt der Externalizer die Beantwortung der HTTP Anfrage und stellt dem Browser alle Ressourcen zur Verfügung (HTML, CSS, Graphiken, Javascript) Die HTML-Darstellung wird dabei über die zuständigen Renderer durch Durchlaufen des Komponenten-Baums generiert 10 Komponentenorientierte Webanwendungen mit wingS 2.0 © eXXcellent solutions gmbh, Benjamin Schmid
  11. 11. Inhalt Einleitung Was ist wingS Architektur Applikationserstellung JSF vs. wingS am Beispiel Fazit 11 Komponentenorientierte Webanwendungen mit wingS 2.0 © eXXcellent solutions gmbh, Benjamin Schmid
  12. 12. Applikationserstellung mit wingS Darstellung Die visuelle Darstellung der Komponenten bestimmt sich vorrangig über die Inhalte ihres Modells aber auch über ihre gesetzten Styling Eigenschaften (Größe, Farbe, etc.) Layout Über Container-Komponenten lassen sich Komponenten zu komplexeren Komponenten kombinieren Verantwortlich für die Anordnung innerhalb eines Containers sind dabei Layout-Manager Logik Event Listener erlauben die Anbindung der Geschäftslogik an die einzelnen Komponenten und damit die Reaktion auf Benutzerinteraktionen 12 Komponentenorientierte Webanwendungen mit wingS 2.0 © eXXcellent solutions gmbh, Benjamin Schmid
  13. 13. Darstellung von Komponenten Inhalte Verändern der Modellinhalte einer Komponente label.setText(„Text“) radioButton.getModel().setSelected(true); Dynamische Styles Setzen der visuellen Komponenteneigenschaften c.setForeground(Color.RED); c.setBorder(new SEmptyBorder(5,5,5,5); c.setFont(new SFont(„Arial“)); Explizite Zuweisung von CSS-Eigenschaften und -Klassen c.setAttribute(CSSProperty.FONT-STYLE,“bold“); c.setClass(„fehlermeldung“) Statische Eigenschaften Einbinden globaler CSS Deklarationen Schreiben eigener Renderer 13 Komponentenorientierte Webanwendungen mit wingS 2.0 © eXXcellent solutions gmbh, Benjamin Schmid
  14. 14. Layout-Manager in wingS Dynamische Layout-Manager Regelbasierte Anordnung der Komponenten eines Containers (Tabellenweise, Zeilenweise, etc.). Analog zu den Swing LayoutManagern Beispiele: SBorderLayout, SFrameSetLayout, SGridLayout, GridBagLayout, … Statischer Manager (STemplateLayout) Platzierung von Komponenten innerhalb eines HTML-Fragments Eignet sich gut zur Realisierung des statischen Rahmenlayouts 14 <h1><object name=„hello“></object></h1> <table> <tr><td>...</td></tr> <tr><td><object name=„button“></object> </td></tr> </table> Komponentenorientierte Webanwendungen mit wingS 2.0 © eXXcellent solutions gmbh, Benjamin Schmid
  15. 15. Anbindung der Präsentationslogik Analog zu Swing: Anbindung der Logik an die wingS Komponenten via Events Typische Events: „Button gedrückt“, „Tabellenzeile gewählt“, „Text eingegeben“ Werte und Zustände von Eingabe-Komponenten werden in ihren Modellen gehalten und können dort abgefragt werden 15 Komponentenorientierte Webanwendungen mit wingS 2.0 © eXXcellent solutions gmbh, Benjamin Schmid
  16. 16. Inhalt Einleitung Was ist wingS Architektur Applikationserstellung JSF vs. wingS am Beispiel Fazit 16 Komponentenorientierte Webanwendungen mit wingS 2.0 © eXXcellent solutions gmbh, Benjamin Schmid
  17. 17. Exkurs JSF: Ein einfaches Ratespiel (1) Eindrücke aus den JavaServer Faces (JSF): Das Guess-A-Number Beispiel von Sun Quelle: Sun 17 Komponentenorientierte Webanwendungen mit wingS 2.0 © eXXcellent solutions gmbh, Benjamin Schmid
  18. 18. Exkurs JSF: Ein einfaches Ratespiel (2) Einbinden der Logik via JSF-Tags in die JSP Seite <%@ taglib uri="http://java.sun.com/jsf/html" prefix="h" %> <%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %> <body bgcolor="white"> <f:view> <h:form id="helloForm" > <h2>Hi. My name is Duke. I'm thinking of a number from <h:outputText value="#{UserNumberBean.minimum}"/> to <h:outputText value="#{UserNumberBean.maximum}"/>. Can you guess it?</h2> <h:graphicImage id="waveImg" url="/wave.med.gif" /> <h:inputText id="userNo" value="#{UserNumberBean.userNumber}" validator="#{UserNumberBean.validate}"/> <h:commandButton id="submit" action="success" value="Submit"/> <p><h:message style="color: red; serif; font-style: oblique; text-decoration: overline„ id="errors1" for="userNo"/> </h:form> </f:view> Quelle: Sun 18 Komponentenorientierte Webanwendungen mit wingS 2.0 © eXXcellent solutions gmbh, Benjamin Schmid
  19. 19. Exkurs JSF: Ein einfaches Ratespiel (3) Ablaufsteuerung in JSF via faces-config.xml <?xml version='1.0' encoding='UTF-8'?> <!DOCTYPE faces-config PUBLIC "-//Sun Microsystems, Inc.//DTD JSF Config 1.1//EN" "http://java.sun.com/dtd/web-facesconfig_1_1.dtd"> <faces-config> <application> <locale-config> <default-locale>en</default-locale> <supported-locale>de</supported-locale> <supported-locale>fr</supported-locale> <supported-locale>es</supported-locale> </locale-config> </application> <managed-bean> <description> The "backing file" bean that backs up [...] </description> <managed-bean-name>UserNumberBean</managed-bean-name> <managed-bean-class>guessNumber.UserNumberBean</managedbean-class> <managed-bean-scope>session</managed-bean-scope> <managed-property> <property-name>minimum</property-name> <property-class>int</property-class> <value>0</value> </managed-property> <managed-property> <property-name>maximum</property-name> <property-class>int</property-class> <value>10</value> </managed-property> </managed-bean> </faces-config> Komponentenorientierte Webanwendungen mit wingS 2.0 <navigation-rule> <description> The decision rule used by the NavigationHandler </description> <from-view-id>/greeting.jsp</from-view-id> <navigation-case> <description> Indicates to the NavigationHandler [...] </description> <from-outcome>success</from-outcome> <to-view-id>/response.jsp</to-view-id> </navigation-case> </navigation-rule> 19 <navigation-rule> <description> The decision rules used by [...] </description> <from-view-id>/response.jsp</from-view-id> <navigation-case> <description> Indicates to the NavigationHandler [...] </description> <from-outcome>success</from-outcome> <to-view-id>/greeting.jsp</to-view-id> </navigation-case> </navigation-rule> © eXXcellent solutions gmbh, Benjamin Schmid
  20. 20. Exkurs JSF: Ein einfaches Ratespiel (4) Prüflogik in JSF als Validator public void validate(FacesContext context, if (minimumSet && UIComponent component, (converted < minimum)) { Object value) throws if (maximumset) { throw new ValidatorException { validatorexception(messagefactory.getmessage if ((context == null) || (component == null)) { throw new NullPointerException(); (context, component, } validator.not_in_range_message_id, new object[]{ if (value != null) { new double(minimum), try { new double(maximum) int converted = intValue(value); })); if (maximumSet && } else { (converted > maximum)) { throw new validatorexception( if (minimumSet) { messagefactory.getmessage throw new ValidatorException( (context, component, MessageFactory.getMessage longrangevalidator.minimum_message_id, (context, component, new object[]{ Validator.NOT_IN_RANGE_MESSAGE_ID, new integer(minimum) new Object[]{ })); new Integer(minimum), } new Integer(maximum) } })); } catch (numberformatexception e) { } else { throw new validatorexception( throw new ValidatorException( messagefactory.getmessage MessageFactory.getMessage (context, component, (context, component, LongRangeValidator.MAXIMUM_MESSAGE_ID, longrangevalidator.type_message_id)); } new Object[]{ } new Integer(maximum) } })); Quelle: Sun } } Komponentenorientierte Webanwendungen mit wingS 2.0 20 © eXXcellent solutions gmbh, Benjamin Schmid
  21. 21. Vergleich wingS vs. JSF 21 Komponentenorientierte Webanwendungen mit wingS 2.0 © eXXcellent solutions gmbh, Benjamin Schmid
  22. 22. Das einfache Ratespiel mit wingS 22 Komponentenorientierte Webanwendungen mit wingS 2.0 © eXXcellent solutions gmbh, Benjamin Schmid
  23. 23. Inhalt Einleitung Was ist wingS Architektur Applikationserstellung JSF vs. wingS am Beispiel Fazit 23 Komponentenorientierte Webanwendungen mit wingS 2.0 © eXXcellent solutions gmbh, Benjamin Schmid
  24. 24. Gegenüberstellung JSF/wingS: JSF J2EE Standard Hohe Öffentlichkeitswirkung Konzeptionell immer noch JSP/Struts JavaServer Faces Effizienz nur über Tools möglich Fehlerträchtige Pflege von drei Quellen notwendig Dialogseiten (HTML/JSP/Taglibs) Dialogbeans (Java) Ablaufsteuerung (XML) JSP/HTML Basis impliziert: Mangelnder Abstraktionsgrad Effizienz Dynamische/MDA Konzepte schwierig Schlechte Wiederverwendbarkeit / Polymorphie Vermischung Darstellung/Logik Schwieriges Refactoring und Debugging 24 Komponentenorientierte Webanwendungen mit wingS 2.0 © eXXcellent solutions gmbh, Benjamin Schmid
  25. 25. Gegenüberstellung JSF/wingS: wingS „Echtes“ OO-/ Komponentenbasiertes Design von Webapplikationen durch H-MVC Hohe Effizienz durch hohen Abstraktionsgrad Reduzierter und übersichtlicher Code Ermöglicht MDA orientierte Konzepte (vgl. pleXX) Viele Web-Aspekte für Entwickler komplett transparent Klare Trennung von Darstellung und Logik Java-Basiertheit bedeutet Einfach: Java-Skills genügen, Swing Know-how hilft weniger Fehler möglich (Compiler/Syntax) kein Technologie-Mix und einfache Wartung Polymorphie und Refactoring kein Problem Ermöglicht HotSpot Deployment und Debugging 25 Komponentenorientierte Webanwendungen mit wingS 2.0 © eXXcellent solutions gmbh, Benjamin Schmid
  26. 26. Weiterführende Informationen Ausstellungsbereich Stand 11.3 Benjamin Schmid (B.Schmid@exxcellent.de) www.j-wings.org www.exxcellent.de/wings 26 Komponentenorientierte Webanwendungen mit wingS 2.0 © eXXcellent solutions gmbh, Benjamin Schmid

×