1. <Insert Picture Here>
True Abstraction
JSF 2.0 Composite Components
Ed Burns <http://ridingthecrest.com>
JSF Technical Lead
Oracle America, Inc.

2. 2
Presentation GoalsPresentation Goals
• ShareShare the vision forthe vision for
composite componentscomposite components
• ExposeExpose you to everythingyou to everything
you need to know toyou need to know to
master compositemaster composite
componentscomponents
• DemonstrateDemonstrate the creationthe creation
of a non-trivial compositeof a non-trivial composite
componentcomponent

3. 3
Agenda: All About Composite Components
• Beginning
– JSF 1.0 Vision and Reality
– JSF 2.0 Vision
– DEMO: A taste of the future
• Middle
– Fundamentals
– Practice
– Small stuff (resource bundles, EL in resources, “this”)
• End
– How to Think About Composite Components

4. 4
Speaker Qualifications: Ed Burns
– Consulting Staff Member at Oracle America, Inc.
– Since inception, co-leader of the team that develops the JavaServer™
Faces (JSF) Specification
– Co-author of the McGraw-Hill book, JavaServer Faces, The Complete
Reference and upcoming JSF2: The Complete Reference
– Author of the McGraw-Hill book: Secrets of Rock Star Programmers:
Riding the IT Crest
– Prior to JSF Ed worked on the Sun Java Plug-in, Mozilla Open JavaVM
Interface, NCSA Mosaic

5. 5
Beginning

6. 6
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
OracleOracle
ComponentsComponents
SunSun
ComponentsComponents

7. 7
JavaOne 2001 Technical Keynote

8. 8
JSF 1.X Component Reality
• Good
– Very active and healthy component market
– Very good IDE support
• Bad
– Components not easy enough to build
– Component vendors had to invent stuff because the spec didn't
solve
• Ajax
• Resource Loading
• Library Ordering Precedence

9. 9
JSF 2.0 Vision for Compnents
• This...

10. 10
Make components easy to develop
• Becomes this...

11. 11
Make components easy to develop
• Or maybe this...
… if you want to get fancy
• “Pay as you go” complexity

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

13. 13
Demo: Simple Login Panel

14. 14
Middle

15. 15
Composite Component Fundamentals
1.Resource Libraries
2.Conventions
– XML Namespace
• Default namespace prefix + resource library name
– Component name
• XHTML filename in resource library
3.<cc:interface> <cc:implementation>
4.Top level component creation
5.Attached Objects
6.#{cc} implicit object

16. 16
Fundamentals: Resource Libraries
• Completes the story for authoring
web components
– markup+css+script+images
– JSF 1.2 only had 25% of that story!
– All component artifacts bundled
together
• Allows the JSF lifecycle to serve
up static content
• Fully localized, versioned
• Dynamic
1. Web app root
2. Classpath

17. 17
Fundamentals: Conventions
• Naming Convention
• Placement
Convention

18. 18
Demo: Conventions
Ask the audience for names, show error messages, as cc is created in the demo

19. 19
Fundamentals: <cc:interface> <cc:implementation>
• <cc:interface>
– Declares everything in the page author needs to know to use
this component. This is more formally known as the usage
contract.
• <cc:implementation>
– Defines the implementation of the contract declared in the
<cc:interface> section
• <cc:interface> can be empty (will be optional in
JSF2.next)

20. 20
Fundamentals: Top Level Component

21. 21
Fundamentals: Top Level Component
Rules for creating the Top-Level Component
1.See if the composite component declares a
componentType attribute on <cc:interface>
2.Look for a script based component with a file name that is the
same name (case sensitive) as the .xhtml file name
3.Look for a java class called <resourceLibName>.<fileName>
4.Create a component of component type
javax.faces.NamingContainer

22. 22
Fundamentals: Attached Objects

23. 23
Demo: Attached Objects

24. 24
Fundamentals: #{cc} implicit object

25. 25
Composite Components: Practice

26. 26
Composite Components: Small stuff
• Resource Bundles in composite component library
• EL in resources
• Nested composite component

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

28. 28
the past, present, and future of the computer human
interface for network aware applications.
JSF 1.x
JSF 2.0
End

29. 29
How to think about
Composite Components
• Building components should not be
scary or hard
• Make everything private and expose
only what the page author needs to
see
• Just do it!