Your SlideShare is downloading. ×
JSF 2.0 Preview
Upcoming SlideShare
Loading in...5

Thanks for flagging this SlideShare!

Oops! An error has occurred.

Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

JSF 2.0 Preview


Published on

At this JAVAWUG meetup, Cagatay Civici talked about JSF 2.0.

At this JAVAWUG meetup, Cagatay Civici talked about JSF 2.0.

Published in: Technology

1 Comment
  • find more information and full webcast of this JSF talk here:
    Are you sure you want to  Yes  No
    Your message goes here
No Downloads
Total Views
On Slideshare
From Embeds
Number of Embeds
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

No notes for slide


  • 1. JSF 2.0 PREVIEW Cagatay Civici
  • 2. About Me Apache MyFaces PMC Member Co-author of “The Definitive Guide to Apache MyFaces and Facelets” Reference in “Core JSF 2nd Edition” Recognized speaker in international and local conferences (JSFOne, JSFDays...) Oracle RCF Member Krank Framework committer JSF Chart Creator Author YUI4JSF Project Lead FacesTrace Project Lead FC Barcelona Fan Working for SpringSource
  • 3. Agenda Overview of JSF 1.x Overview JSF 2.0 What is new? Future of JSF
  • 4. JSF 1.x Overview Component Oriented JSF 1.0, 1.1 and 1.2 Standard (jsr 127 and 252) Two implementations Apache MyFaces Mojarra (RI)
  • 5. JSF 1.x - The Good Component oriented Extendible Third party components (Trinidad, Tomahawk, RichFaces, IceFaces ...) Rapid application development Vendor and Tool support
  • 6. JSF 1.x - The Bad JSP based Performance Not very rich Exception handling Too much xml A bit more...
  • 7. JSF 2.0 Overview JSR 314 Part of JEE 6 New features, improvements and fixes Influenced by community and trends Other web frameworks, Ajax, JSF extensions, Component libs, blogs etc...
  • 8. Roadmap JSR process started in July, 2007 Early Draft Review 1 finished on July 2008 Early Draft Review 2 finished on Oct 2008 Proposed Final Draft Date, December 2008 Timed with JEE 6
  • 9. So What’s New? AJAX Easy Component Development Resource Loading PDL (Page Description Language) More Scopes Less configuration
  • 10. More Component interoperability Scripting (Groovy) Zero deployment time System Events Project Stage Client side validation
  • 11. More... Bookmarks Exception handling Improved State Management Extension Prioritization
  • 12. Resource Handling What is a resource? css, javascript, images ... A resource has; library, version, locale, name Two new classes javax.faces.application.Resource javax.faces.application.ResourceHandler Load from; /resources /META-INF/resources
  • 13. Resource Handling Resource Format [localePrefix/] [libraryName/] [libraryVersion/] resourceName [/resourceVersion] Examples Under /resources or /META-INF/resources - tr/mycoolcomponentlib/1.0/logo.png - mycoolcomponentlib/1.0/widget.js/1.0.js - mycoolcomponentlib/styles.css Ability to load from classpath
  • 14. Resources and Custom Components @ResourceDependency(name=”ajaxsuggest.js”, library=”mycoolcomponentlib”) public class InputSuggest extends UIInput {...} OR @ResourceDependencies({ @ResourceDependency(name=”ajaxsuggest.js”, library=”mycoolcomponentlib”) @ResourceDependency(name=”ajaxsuggest.css”, library=”mycoolcomponentlib”))} public class InputSuggest extends UIInput {...} OR Application app = FacesContext.getCurrentInstance().getApplication(); Resource resource= app.getResourceHandler().createResource(“suggest.js”,”lib”); writer.write(“<script ...”); //encode using request.getRequestPath();
  • 15. Resource Location 4 new tags; h:head h:body h:outputScript h:outputStyleSheet Example ... <h:head> </h:head> <h:body> <h:outputScript name=”suggest.js” target=”head” /> </h:body> ...
  • 16. Resource Handling Demo
  • 17. Ajax Standard JSF-Ajax integration Javascript API for Ajax namespace : javax.faces (Open Ajax Alliance) script: ajax.js
  • 18. Ajax Request javax.faces.Ajax.ajaxRequest(element,event,options) <h:commandButton id=”btn” value=”Submit” action=”#{itemController.newItem}” onclick=”javax.faces.Ajax.ajaxRequest(this,event, {, render:’comp1’})”> </h:commandButton> Include ajax.js <h:outputScript name=”ajax.js” library=”javax.faces” target=”head” /> OR <h:outputAjaxScript target=”head” />
  • 19. Ajax and Custom Components Include ajax.js with annotation @AjaxDependency(target=”head”) public class MyAjaxComponent extends UIInput { } Or with ResourceHandler ResourceHandler.createAjaxResource();
  • 20. Ajax Demo
  • 21. Configuration Annotations instead of xml <managed-bean> <managed-bean-name>createBookController</managed-bean-name> <managed-bean-class> com.bla.bla.view.MyPojo </managed-bean-class> <managed-bean-scope>request</managed-bean-scope> </managed-bean> becomes @ManagedBean(name=”myPojo”) @RequestScoped public class MyPojo { ... }
  • 22. Configuration More annotations @FacesComponent @FacesConverter @ManagedBean @ManagedBeans @ManagedProperty @FacesRenderer @FacesRenderKit @FacesValidator More soon...
  • 23. Project Stage Project environment setting Similar to RAILS_ENV Values; Development UnitTest SystemTest Production (Default)
  • 24. Project Stage web.xml <context-param> <param-name>javax.faces.PROJECT_STAGE</param-name> <param-value>Development</param-value> </context-param> JNDI java:comp/env/jsf/ProjectStage How to get it? Application.getProjectStage()
  • 25. Project Stage Demo
  • 26. System Events Subscription based, no queueing A bit similar to PhaseEvent idea Ingridients System Events System Event Listeners Subscribers (Application or UIComponent)
  • 27. System Events Application level system events public abstract void subscribeToEvent(Class<? extends SystemEvent> systemEventClass, SystemEventListener listener); public abstract void subscribeToEvent(Class<? extends SystemEvent> systemEventClass, Class sourceClass, SystemEventListener listener); public abstract void publishEvent(Class<? extends SystemEvent> systemEventClass, SystemEventListenerHolder source); public void publishEvent(Class<? extends SystemEvent> systemEventClass, Class<?> sourceBaseType, Object source);
  • 28. System Events UIComponent level system events public void subscribeToEvent(Class<? extends SystemEvent> eventClass, ComponentSystemEventListener componentListener); public void unsubscribeFromEvent(Class<? extends SystemEvent> eventClass, ComponentSystemEventListener componentListener); AfterAddToParentEvent BeforeRenderEvent ComponentSystemEvent ViewMapCreatedEvent ViewMapDestroyedEvent
  • 29. System Events Listen with annotations @ListenerFor(systemEventClass=AfterAddToParentEvent.class) public class MyComponent extends UIOutput {} @ListenersFor({ @ListenerFor(systemEventClass=AfterAddToParentEvent.class, @ListenerFor(systemEventClass=BeforeRenderEvent.class)}) public class MyComponent extends UIOutput {}
  • 30. Scopes ViewScope For managed beans Component scope Composition Conversation scope Not in yet, through webbeans?
  • 31. Scopes - ViewScope A new managed bean scope Lives until view is changed @ManagedBean(name=”myBean”) @ViewScoped public class MyBeanInViewScope { ... }
  • 32. Scopes Demo
  • 33. PDL Page Declaration Language Based on Facelets <html xmlns="" xmlns:ui="" xmlns:h="" xmlns:f=""> <h:head> <title>JSF2Demo</title> </h:head> <h:body> <h:form> <h:outputText value="Hello" /> </h:form> </h:body> </html>
  • 34. EZComp Greatly simplifies custom component development Convention over configuration Declarative composite components Components without Java coding Component scope in composition
  • 35. EZComp Page that uses a composition component <html xmlns="" xmlns:ui="" xmlns:h="" xmlns:f="" xmlns:jwug=""> <h:head> <title>EZComp Demo</title> </h:head> <h:body> <h:form> <jwug:greeting value=”Mr. Soprano” /> </h:form> </h:body> </html>
  • 36. EZComp Under %webroot%/resources/jwug/greeting.xhtml <html xmlns="" xmlns:h="" xmlns:f="" xmlns:ui="" xmlns:composite=""> <body> <composite:interface> <composite:attribute name="value" required="true" /> </composite:interface> <composite:implementation> <h:outputText value=”Hello #{compositeComponent.attrs.value}” /> </composite:implementation> </body> </html>
  • 37. EZComp - Slider Scriptaculous based slider <html xmlns="" xmlns:ui="" xmlns:h="" xmlns:f="" xmlns:jwug=""> <h:head> <title>EZComp Demo</title> </h:head> <h:body> <h:form> <jwug:slider value=”#{demo.number}” min=”0” max=”100”/> </h:form> </h:body> </html>
  • 38. EZComp - Slider <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ""> <html xmlns="" xmlns:h="" xmlns:f="" xmlns:ui="" xmlns:composite=""> <body> <composite:interface> <composite:attribute name="id" required="true" /> <composite:attribute name="value" required="true" /> <composite:attribute name="min" required="false" /> <composite:attribute name="max" required="false" /> </composite:interface> <composite:implementation> <h:outputScript name="prototype.js" library="script" target="head"/> <h:outputScript name="scriptaculous.js" library="script" target="head"/> <h:inputText id="sliderField" style="width:100px" value="#{compositeComponent.attrs.value}"></h:inputText> <div id="#{compositeComponent.clientId}_track" style="width:105px;background-color:#aaa;height:5px;"> <div id="#{compositeComponent.clientId}_handle" style="width:5px;height:10px;background-color:#f00;cursor:move;"></div> </div> <script type="text/javascript"> var slider_#{} = new Control.Slider('#{compositeComponent.clientId}_handle','#{compositeComponent.clientId}_track',{range: $R(#{compositeComponent.attrs.min},#{compositeComponent.attrs.max})}); slider_#{}.options.onSlide = function(value){ $('#{compositeComponent.clientId}:sliderField').value = (value + '').split(".")[0]; };</script> </composite:implementation> </body> </html>
  • 39. EZComp Slider Demo
  • 40. Scripting JSF Groovy instead of Java Zero deployment time Reload faces-config Scripted beans, renderers, validators and etc
  • 41. From JSF 2.0 Issue Tracker Optimized state management Exception Handling Bookmarks SelectItems Skinning Partial validation Security more...
  • 42. MyFaces 2.0 Being worked on... JSF 2.0 branch created Not to be late this time
  • 43. Future of JSF More component libraries JSF in EE (WebBeans, Seam, Spring Faces ...) More RIA integration (Flex, Ajax ...) Tool support More adaptation
  • 44. Resources JSF 2.0 EG blog : Ed Burns’s blog: Ryan Lubke’s blog: Jim Driscoll’s blog: JSR Page:
  • 45. The End - Cheers! PS3 Network id: FacesContext