JSF WorkshopMore Than Skin Deep: JavaServer Faces Foundation and Practice
Ed Burns | Oracle CorporationMichael Kurz | Irian Solutions GmbH
JSF Workshop2
Our plan for your time investment 1. Review High Level JSF Systems 2. Teach from Application Developer Viewpoint 3. Teach from UIComponent Developer Viewpoint 4. Teach from Framework Extender Viewpoint
All of this and more in: Ed Burns, Chris Schalk: JavaServer Faces 2.0:
The Complete Reference,McGraw-Hill
Marinschek, Kurz, Mllan: JavaServer Faces 2.0,dpunkt.verlag
JSF Workshop3
We will not be covering these JSF aspects JSF with thick client
technologies: Flex, Flash, JavaFX, Swing
JSF with non-DesktopWeb Browser client technologies: iPhone, WAP, JavaME
JSF with Spring JSF add-ons
JSF Workshop4
Our plan for your time investment 0. Review High Level JSF Systems 1. Teach from Application Developer Viewpoint
Traverse sample application: scrumtoys View and Controller Layer: navigation, ajax Model Layer: Managed Beans, JSR-303 Validation Review: JSF Lifecycle Persistence Layer: JPA I18N
2. Teach from UIComponent Developer Viewpoint 3. Teach from Framework Extender Viewpoint
JSF Workshop5
Our plan for your time investment 0. Review High Level JSF Systems 1. Teach from Application Developer Viewpoint 2. Teach from UIComponent Developer Viewpoint
Composite Components, including JSR-276 Metadata Resource Libraries Ajax Integration Scripting to save time Component annotations
3. Teach from Framework Extender Viewpoint
JSF Workshop6
Our plan for your time investment 0. Review High Level JSF Systems 1. Teach from Application Developer Viewpoint 2. Teach from UIComponent Developer Viewpoint 3. Teach from Framework Extender Viewpoint
Patterns that enable extension Survey of extension points Sample extensions
JSF Workshop7
0. Review High Level JSF Systems
JSF Workshop8
0. Review High Level JSF Systems
JSF Workshop9
1. Teach from Application Developer Viewpoint
JSF Workshop10
Traverse Sample Application: Scrumtoys Implement a
simple Scrum Whiteboard
Don't know Scrum? http://scrumalliance.org/
JSF Workshop11
Scrumtoys Architecture Two ways to slice a JSF app
Domain architecture How the Domain Architecture maps to JSF
JSF Workshop12
Domain Architecture
JSF Workshop13
How the Domain Architecture Maps to JSF
JSF Workshop14
Demo: Traverse Application
JSF Workshop15
Application Developer ViewpointThe V in MVC: View
Facelets is an official part of JSF2 JSF 2 Views authored as Facelets Pages: XHTML
Must be well formed XML Taglibs referenced using XML namespace
declaration in element
Components in a taglib are referenced in pages using prefix:tagName syntax, as in or
JSF Workshop16
Application Developer ViewpointThe V in MVC: View
Most new features in JSF2 only available when using the built-in Facelets
Facelets includes a powerful templating feature that enables reuse of page markup.
Exercise 1: Basic Facelets Templating
JSF Workshop17
Application Developer ViewpointThe C in MVC: Controller
Old school Struts Action concept It's HTML: one button-click per HTTP POST The button-click takes you to a new page, or keeps you
on the same page. For web applications,
Controller == Page Navigation JSF2 offers two ways to declare page navigation
In faces-config.xml elements In xhtml pages using implicit navigation
JSF Workshop18
Application Developer ViewpointThe C in MVC: Controller
Exercise 2: Convert XML based navigation toimplicit navigation
JSF Workshop19
Application Developer ViewpointThe C in MVC: Controller
New school: Ajax, update parts of the view without bothering the user with a full page refresh
Two approaches Declarative: tag Programmatic: jsf.ajax JavaScript Object
JSF Workshop20
Application Developer ViewpointThe C in MVC: Controller
Demo: Two approaches to Ajax
Programmatic Declarative
Modify sprint show page.
JSF Workshop21
Application Developer ViewpointThe M in MVC: Model
JSF was the first web framework to support Dependency Injected (DI) POJOs: Managed Beans
Managed Beans made JSF useful out of the box. Many other DI technologies can be easily used with JSF
Spring Seam Guice CDI (JSR-299 in JavaEE 6)
No matter which DI you use, the way they work with JSF will be mostly the same.
JSF Workshop22
Application Developer ViewpointThe M in MVC: Model
Every DI framework needs a way for the developer to tell the system which Java objects to manage and how to manage them.
The name by which the program will reference the object
The Java class (or script file name) for the object The scope into which an instance of the object
should be placed. If any properties on the object should be injected with
values, the names of the properties and how to get values for each one.
JSF Workshop23
Application Developer ViewpointThe M in MVC: Model
Exercise 3: Add an XML declared managed-bean to an existing application
JSF Workshop24
Application Developer ViewpointThe M in MVC: Model
Exercise 3a: Replace the XML declaration with Annotation based declaration
JSF Workshop25
Application Developer ViewpointThe M in MVC: Model JSF 1.0 1.2: only way to declare Managed Beans
was via XML
user request
JSF 2.0 on Java EE 5 non-mandatory javax.faces.bean Annotations
JSF 2.0 on Java EE 6 @javax.enterprise.context.RequestScoped @javax.inject.Named @javax.enterprise.inject.Model)
JSF Workshop26
Review: The Lifecycle Orchestrates MVCThe Baseball and Apple Pie of Web apps
Data Conversion and Validation Page Flow Database integration
I18N, L10N, A11Y Support CSS, Markup
based layout User Friendliness!
JSF Workshop27
Review: The Lifecycle Orchestrates MVCThe Baseball and Apple Pie of Web apps
JSF Workshop28
Review: The Lifecycle Orchestrates MVCThe Baseball and Apple Pie of Web apps
The JSF Lifecycle uses some elements of the strategy design pattern
Define a family of algorithms Encapsulate each one Make them interchangeable
For each Lifecycle phase, traverse theUIComponent hierarchy and take theappropriate action.
JSF Workshop29
Review: The Lifecycle Orchestrates MVCAdditional details added
JSF Workshop30
PersistenceMaking it real
Persistence not part of the JSF spec, for good reason It's a different problem It requires different kinds of expertise Selling point for using JCP based technologies: you
can't go too far wrong because application partitioning is at least loosely defined
Contrast with IBM's San Francisco Framework (1999)
JSF Workshop31
PersistenceMaking it real
Demo: JPA in Scrumtoys
JSF Workshop32
InternationalizationGet local
Forget It doesn't work with Ajax It mixes layers inappropriately
Use and elements inside in faces-config.xml
i18n i18n i18n
JSF Workshop33
InternationalizationGet local
Demo: I18N in Scrumtoys
ValidationMessages.properties
Properties files declared in faces-config
JSF Workshop34
2. Teach from UIComponent Developer Viewpoint
JSF Workshop35
Developing UIComponentsWhy JSF Exists
This was way too hard to begin with Informed by old school Struts thinking
Config files XML entries that must be kept in synch No configuration via convention
On the plus side, very configurable and customizable This way still works and the new way is built on top of
the old way.
JSF Workshop36
JSF 1.x Vision for Components
Create a market for re-usable JSF components, allowing developers to easily create UI's for web applications by combining off-the-shelf components from multiple vendors using nice GUI tools.UserUser
ComponentsComponents
OracleOracleComponentsComponents
SunSunComponentsComponents
JSF Workshop37
JSF Workshop38
New Way to build UIComponentsUse Markup for Markup, Code for Code
This...
JSF Workshop39
New Way to build UIComponentsUse Markup for Markup, Code for Code
Becomes this...
JSF Workshop40
New Way to build UIComponentsUse Markup for Markup, Code for Code
Or maybe this...
if you want to get fancy
Pay as you go complexity
JSF Workshop41
JSF 2.0 Component Vision multi-select components on a
JSF page press a componentize
button you get a wizard that lets you
choose how to expose the content of this component to the page author
the component appears in a palette.
JSF Workshop42
Demo: Change Sprint form to be Composite Component
JSF Workshop43
How do we enable this vision? Reduce the number of artifacts required Provide a way to bundle associated resources with the
component Do it all dynamically, while the app is deployed Allow the composite component to be a real component
attached objects children components facets ajax capable
The old way still works.
JSF Workshop44
Multi-component-vendors in a single page How do we solve this problem?
Look at what each vendor had to invent and standardize it
Source of difficulty Old Way Standard WayResource Loading PhaseListener, Filter, etc. Built into the
LifecycleAjax Proprietary .js file for
innerHTML updating Proprietary XML Ajax
Response Format
jsf.ajax JavaScript Object with four functions
Standard XML Ajax Response Format
Library Loading Precedence
Rename Jar files for alphabetical sort order
, elements
JSF Workshop45
Composite Component Exercise Exercise 4: Create a simple composite component
JSF Workshop46
Coming to Terms with Composite Components Composite Component
A tree of UIComponent instances, rooted at a top level component that can be thought of and used as a single component in a view
Using Page The page in which a composite component is used
Composite Component Tag Instance The tag that places an instance of a composite
component in the using page
Defining Page The markup page, usually Facelets that contains the
composite component declaration and definition
JSF Workshop47
Coming to Terms with Composite Components Top Level Component
The UIComponent instance implicitly createdby the run-time to serve as the root for thecomposite component tree.
Inner Component Any UIComponent inside the defining page or
any pages used by that defining page
JSF Workshop48
Other Composite Component Concepts Method Expressions DEMO: dashboard Runtime Metadata Resources Per-component ResourceBundle Custom top level components, also from Script
JSF Workshop49
3. Teach from Framework Extender Viewpoint
JSF Workshop50
Patterns that enable extension Decorator pattern Wrapper Classes Implementation savvy: never use this in the
implementation of classes that can be decorated
JSF Workshop51
Survey of Extension Points
Class or interface Class or interface
ActionListener PhaseListener
ApplicationFactory PropertyResolver
Converter RenderKit
ELResolver RenderKitFactory
ExceptionHandlerFactory StateManager
ExternalContextFactory VariableResolver
FacesContextFactory Validator
LifecycleFactory ViewDeclarationLanguageFactory
NavigationHandler ViewHandler
= artifact can be decorated
JSF Workshop52
Framework Extension Demo Create a custom ELResolver, in ScrumToys
JSF Workshop53
How we invested your time 1. Review High Level JSF Systems 2. Teach from Application Developer Viewpoint 3. Teach from UIComponent Developer Viewpoint 4. Teach from Framework Extender Viewpoint
All of this and more in: Ed Burns, Chris Schalk: JavaServer Faces 2.0:
The Complete Reference,McGraw-Hill
Marinschek, Kurz, Mllan: JavaServer Faces 2.0,dpunkt.verlag
Thank you!
Ed Burns | Oracle Corporationhttp://ridingthecrest.com/Michael Kurz | Irian Solutions GmbHhttp://www.irian.at
Top Related