Presentation is loading. Please wait.

Presentation is loading. Please wait.

Building JSF applications with the JSF Tools Project | © 2008 by Oracle Inc; made available under the EPL v1.0 1 Eclipse Web Tools Platform – Uncovered.

Similar presentations


Presentation on theme: "Building JSF applications with the JSF Tools Project | © 2008 by Oracle Inc; made available under the EPL v1.0 1 Eclipse Web Tools Platform – Uncovered."— Presentation transcript:

1 Building JSF applications with the JSF Tools Project | © 2008 by Oracle Inc; made available under the EPL v1.0 1 Eclipse Web Tools Platform – Uncovered : Building JavaServer Faces (JSF) web applications The JavaServer Faces (JSF) Tools Project Raghu Srinivasan Cameron Bateman

2 Building JSF applications with the JSF Tools Project | © 2008 by Oracle Inc; made available under the EPL v1.0 2 Goals Review JavaServer Faces (JSF) concepts Build an end-to-end JavaServer Faces (JSF) web application Get a thorough understanding of the features in the JSF Tools Project Preview the new features in the JSF Tools Project

3 Building JSF applications with the JSF Tools Project | © 2008 by Oracle Inc; made available under the EPL v1.0 3 Agenda Introduction to JavaServer Faces (JSF) Technology JSF Tools Project Features Hands on: Develop JSF “Hello JSF” Application Demo: Deep Dive into JSF Web Application Development Demo: What’s new in the JSF Tools Project ? Q&A

4 Building JSF applications with the JSF Tools Project | © 2008 by Oracle Inc; made available under the EPL v1.0 4 Introduction to JavaServer Faces (JSF) Technology

5 Building JSF applications with the JSF Tools Project | © 2008 by Oracle Inc; made available under the EPL v1.0 5 Introduction to JavaServer Faces (JSF) JavaServer Faces (JSF) is a UI Component Framework for building Java-based Web applications JSF is a standard specification developed through the Java Community Process (JCP) and is part of the Java EE 5 standards JSF is based on the Model-View-Controller (MVC) architecture JSF 1.2 is the current version of the specification JSF 2.0 (JSR-314) is in the specification stage

6 Building JSF applications with the JSF Tools Project | © 2008 by Oracle Inc; made available under the EPL v1.0 6 JSF Implementations Reference Implementation (RI) from Sun  https://javaserverfaces.dev.java.net/download.html https://javaserverfaces.dev.java.net/download.html Apache MyFaces project  Implementation consists of  Java API classes representing the JSF framework services  The JavaServer Faces Core Tag Library for wiring components to server-side objects  The JavaServer Faces Standard HTML RenderKit Tag Library for expressing UI components within a JSP page

7 Building JSF applications with the JSF Tools Project | © 2008 by Oracle Inc; made available under the EPL v1.0 7 JSF Technology Key Concepts A basic JSF application consists of:  Web pages defined using JSF UI components  A JSP page built using JSP tags that encapsulate the corresponding JSF Components  Application configuration resource files (faces-config.xml) that defines rules for navigation between the web pages  Managed Beans and Backing Beans for data integrations and to facilitate the UI logic of the application  Helper objects - Event listeners, Validators, and Converters that are registered on the components  web.xml - Register the FacesServlet and its mapping

8 Building JSF applications with the JSF Tools Project | © 2008 by Oracle Inc; made available under the EPL v1.0 8 JSF Technology Key Concepts JSF UI Components  The basic building block for assembling a JSF web application  Server-side UI Component framework - a JSF Page is represented on the server as a tree of UI Components  JSF defines helper API’s to support the components  Events and Listeners – an Event broadcast and Listener registration model based on the JavaBeans specification  Converters – Pluggable data conversion class that converts markup value to and from the corresponding type in the model  Validators – Pluggable support classes that can ensure that the input values conform to business rules

9 Building JSF applications with the JSF Tools Project | © 2008 by Oracle Inc; made available under the EPL v1.0 9 JSF Technology Key Concepts Managed Beans  POJO beans registered in a application configuration resource file (faces-config.xml) and accessed from a JSF page Backing Beans  A managed bean where the UI Components of a page are bound to properties in the bean Unified Expression Language (EL)  A simple expression language that allows page authors to dynamically read and write data from JavaBeans and invoke methods defined in them

10 Building JSF applications with the JSF Tools Project | © 2008 by Oracle Inc; made available under the EPL v JSF Technology Key Concepts Page Navigation  JSF provides a simple yet flexible Navigation model that helps in defining page-to-page navigation in response to UI events and model interactions  Navigation rules define the next page to be displayed for a given event or outcome  Navigation rules are configured in the application configuration resource file (faces-config.xml)  Navigation handler is pluggable  Default Navigation Handler derives the next page based on  Current page that is being processed  Current action from that page  Logical outcome of the action

11 Building JSF applications with the JSF Tools Project | © 2008 by Oracle Inc; made available under the EPL v JSF Technology Key Concepts The Lifecycle  The JSF specification defines a request processing lifecycle that specifies the processing sequence of every request that involves a JSF component tree Phases  Restore View – Build/Find the view for the current page  Apply Request Values – Each component in the view extracts its values from the request parameters  Process Validation – Run the validators registered on this component  Update Model Values – update the bean properties bound to the value attribute of the component  Invoke Application – Process events and page navigation  Render Response – Render the new page

12 Building JSF applications with the JSF Tools Project | © 2008 by Oracle Inc; made available under the EPL v1.0 Restore Restore View Client / Browser RenderResponse JSF Technology Key Concepts JSF Lifecycle – Initial Request

13 Building JSF applications with the JSF Tools Project | © 2008 by Oracle Inc; made available under the EPL v1.0 Restore View Apply Request Values Update Model Invoke Application Render Response Process Validation JSF Technology Key Concepts Client / Browser JSF Lifecycle - Post back

14 Building JSF applications with the JSF Tools Project | © 2008 by Oracle Inc; made available under the EPL v JSF Technology Key Concepts Renderers  JSF Component model architecture has a clear separation between the functionality of a component and the way it is rendered on a client  Renderer adapts a component to a specific output for a specific client  Encode – represent the value of the component in the target client  Decode – interpret the value in the request parameter and update the component value  RenderKit – a family of Renderers for a specific client such as the HTML render kit

15 Building JSF applications with the JSF Tools Project | © 2008 by Oracle Inc; made available under the EPL v JSF Tools Project Features

16 Building JSF applications with the JSF Tools Project | © 2008 by Oracle Inc; made available under the EPL v JSF Tools Project Features Web Page Editor for HTML/JSP/JSF pages Faces Configuration Model, Editor and Wizards JSF Library Registry Extensible Frameworks Support for  The JSF Standard Tag Libraries  The Apache MyFaces Trinidad Tag Library Support for view description types other than JSP. Support for JavaServer Faces 1.1 and 1.2 versions

17 Building JSF applications with the JSF Tools Project | © 2008 by Oracle Inc; made available under the EPL v Web Page Editor

18 Building JSF applications with the JSF Tools Project | © 2008 by Oracle Inc; made available under the EPL v Web Page Editor Multi-page Editor Visual Page Designer  Provides close-to-WYSIWYG editing experience  Split-pane window shows both the Design and the Source view with options to switch to a Source-only or a Design-only view Source Editor  Content assists, syntax and semantic validations Preview Page  Renders the page as it would look in a browser

19 Building JSF applications with the JSF Tools Project | © 2008 by Oracle Inc; made available under the EPL v Web Page Editor Fly-out Component Palette  Supports Drag & Drop editing Property View  Groups key attributes of the selected tag in an accordion style tabs Outline view  Displays the content of the current page in an hierarchical form

20 Building JSF applications with the JSF Tools Project | © 2008 by Oracle Inc; made available under the EPL v Faces Configuration Editor

21 Building JSF applications with the JSF Tools Project | © 2008 by Oracle Inc; made available under the EPL v Faces Configuration Model, Editor and Wizards Multi-page editor Overview Page  Summary of elements in the configuration file Navigation page  Graphical diagram editor for navigational rules Managed bean page  Form-based editor, Wizards Component and Others Page  Form-based editor for components, render kits, validators and other artifacts Source Page  Contents kept in sync with changes in other pages

22 Building JSF applications with the JSF Tools Project | © 2008 by Oracle Inc; made available under the EPL v JSF Library Registry

23 Building JSF applications with the JSF Tools Project | © 2008 by Oracle Inc; made available under the EPL v JSF Library Registry Define a named collection of JARs including tag libraries, JSF reference implementations and utility jars Add, remove libraries associated with a project Automate build classpath and deployment Extension point for component developers to contribute their libraries

24 Building JSF applications with the JSF Tools Project | © 2008 by Oracle Inc; made available under the EPL v Extensible Frameworks Design-time Meta-data Framework  Uniform Meta-data support  Define new services and enhance existing services Design-time Tag Processor  Meta-data driven  Pluggable tag converters Design-time Application Manager  Provide an approximation of certain JSF runtime state information at design-time.  Pluggable design-time variable, property and method resolvers

25 Building JSF applications with the JSF Tools Project | © 2008 by Oracle Inc; made available under the EPL v Extensible Frameworks JSF Application Configuration Manager  Provide a unified application configuration model through API, effectively merging all faces configuration models into a single model  Notification services to monitor changes to the EMF objects in the model  Cross model validation will be supportable

26 Building JSF applications with the JSF Tools Project | © 2008 by Oracle Inc; made available under the EPL v Hands on: Develop JSF “Hello JSF” Application

27 Building JSF applications with the JSF Tools Project | © 2008 by Oracle Inc; made available under the EPL v Hello! JSF Tools Project!! Build and execute a simple JSF application  Setup  Register JSF Libraries  Create a Dynamic Web Project with JSF Facet  Create JSF-JSP pages  Resolve Validation errors  Explore the Visual Page Designer  Explore the Faces Configuration Editor  Create and Register Managed Bean  Define Page Navigation  Run the application

28 Building JSF applications with the JSF Tools Project | © 2008 by Oracle Inc; made available under the EPL v Setup Configure the workspace with all the requisite software  Download  The Java SE 5 Development Kit (JDK) The Java SE 5 Development Kit (JDK)   Eclipse IDE for Java EE Developers (Europa Winter maintenance) Eclipse IDE for Java EE Developers (Europa Winter maintenance)  Includes Eclipse WTP Mylyn   Apache Tomcat 6.0 Apache Tomcat 6.0   JavaServer Faces RI v1.2 JavaServer Faces RI v1.2   JSP (tm) Standard Tag Library 1.2 implementation JSP (tm) Standard Tag Library 1.2 implementation  https://maven-repository.dev.java.net/repository/jstl/jars/ https://maven-repository.dev.java.net/repository/jstl/jars/

29 Building JSF applications with the JSF Tools Project | © 2008 by Oracle Inc; made available under the EPL v Register the Tomcat Server Select Windows > Preferences.. Select Server > Installed Runtimes. Click Add. Select Apache Tomcat v6.0 Select Also create new local server. Click Next Browse to the Tomcat installation directory. Click Finish

30 Building JSF applications with the JSF Tools Project | © 2008 by Oracle Inc; made available under the EPL v Start and Stop the Tomcat Server Select Windows > ShowView >Servers Right mouse on the server Tomcat v6.0 Server at localhost Select Start to start the server. Wait for the state to change to Started Select Stop to stop the server

31 Building JSF applications with the JSF Tools Project | © 2008 by Oracle Inc; made available under the EPL v Make the Web Page Editor the default editor for JSP pages Select Windows > Preferences.. Select General > Editors > File Associations Select *.jsp in the section File Types Select Web Page Editor In the section Associated Editors Select Default

32 Building JSF applications with the JSF Tools Project | © 2008 by Oracle Inc; made available under the EPL v Import the JSF-EL Template Select Window > Preferences... Select Web and XML > JSP Files > Templates Select Import Browse to JSF-EL Template.xml

33 Building JSF applications with the JSF Tools Project | © 2008 by Oracle Inc; made available under the EPL v Register JSF Libraries Select Windows > Preferences > Web and XML > JavaServer Faces Tools > Libraries. Click on the New.. Create the SUN-RI library  Select the jars from 3rd- party\JSF12  Set the implementation flag to true Create the JSTL library  Select the jars from \3rd- party\JSTL

34 Building JSF applications with the JSF Tools Project | © 2008 by Oracle Inc; made available under the EPL v Create a Dynamic Web Project with JSF Facet Select File->New->Project.. Select Web->Dynamic Web Project  Set the name of the project to JSFToolsTutorial.  In the configuration section, select the JavaServer Faces v1.2 Project  On the JSF Capabilities page, add the JSTL library  Click Finish

35 Building JSF applications with the JSF Tools Project | © 2008 by Oracle Inc; made available under the EPL v Create JSF-JSP pages From the Package Explore view, right-mouse click on the WebContent folder, select New- >JSP  For File Name, enter login.jsp  Accept the defaults. Hit Finish.  The page is opened in the Web Page Editor Open the Properties View  Right-mouse click on the designer canvas and from the context menu, select Show- >Properties  Wait for the ‘Reading Properties’ dialog to disappear (only in WTP 2.0.2)

36 Building JSF applications with the JSF Tools Project | © 2008 by Oracle Inc; made available under the EPL v Add CommandButton to the page From the Palette View, click on the section JSF HTML to display the list of components. DragAndDrop the CommandButton to the canvas  This wraps the CommandButton with view and form tag In the properties view, Click on Quick Edit  Set the value attribute to Login  Set the action attribute to ‘login’

37 Building JSF applications with the JSF Tools Project | © 2008 by Oracle Inc; made available under the EPL v Add PanelGrid From the Palette View, DragAndDrop PanelGrid to the canvas  Notice feedback on the drop target Drop before the command button, but inside the form  The PanelGrid is created with four OutputText components

38 Building JSF applications with the JSF Tools Project | © 2008 by Oracle Inc; made available under the EPL v Modify the PanelGrid Click on Item2 and hit Delete Add InputText after Item1 and before Item3 Delete Item 4 Add InputSecret after Item3

39 Building JSF applications with the JSF Tools Project | © 2008 by Oracle Inc; made available under the EPL v Modify the PanelGrid (continued) Click on Item1 Change its value in the Source View to ‘Name’ Click on Item3 Change its value in the Property View to ‘Password Click on the inputText tag next to Name In the Property View, set the value attribute to ‘#{loginBean.name}’. Save

40 Building JSF applications with the JSF Tools Project | © 2008 by Oracle Inc; made available under the EPL v Create and Register a Managed Bean Click on Problem View. Note the warning message  ‘loginBean cannot be resolved’ Open Webcontent->WEB-INF- >faces-config.xml Switch to the Managed Bean Page Click on session in the list and select add Select the Create Java class option For Package name, enter jsftutorial For Class name, enter LoginBean Complete the wizard Save

41 Building JSF applications with the JSF Tools Project | © 2008 by Oracle Inc; made available under the EPL v Create the Managed Bean class Click on the hyperlink Managed Bean class* to edit the Java class, jsftutorial.LoginBean.java Add two string properties, name and password Generate Setters and Getters  Right-mouse click on the editor and select Source->Generate Getters And Setters Save Validate the login.jsp page  In the Package Explorer, Right- mouse click on ‘login.jsp’ and from the context menu, select ‘Valdate’

42 Building JSF applications with the JSF Tools Project | © 2008 by Oracle Inc; made available under the EPL v Explore Content Assist Open the login.jsp Click on the inputSecret tag for password In the Source Page, click next to the tag, inputSecret and hit Ctrl+Space to get Content Assist. Type ‘J’ to narrow choice to JSF Value EL binding. Select it. Use ContentAssist to bind the value attribute to #{loginBean.password} Save

43 Building JSF applications with the JSF Tools Project | © 2008 by Oracle Inc; made available under the EPL v Add Welcome page Add a welcome.jsp page

44 Building JSF applications with the JSF Tools Project | © 2008 by Oracle Inc; made available under the EPL v Define Page Navigation In the Package Explorer, navigate to and open the file WEB- INF/faces-config.xml Click on the Navigation Rule tab From the Package Explorer, DragAndDrop the login.jsp and welcome.jsp to the Navigation tab. Connect the two pages. Click on the Link control in the Palette, select the login page and draw a line to the welcome page. Select the line in the Navigation tab and in the property view, set the value of the from-outcome to login

45 Building JSF applications with the JSF Tools Project | © 2008 by Oracle Inc; made available under the EPL v Run the Application on the Server In the Package explorer, select login.jsp From the Context Menu, select Run As.->Run On Server Follow the wizard

46 Building JSF applications with the JSF Tools Project | © 2008 by Oracle Inc; made available under the EPL v Demo: Deep dive into JSF web application development

47 Building JSF applications with the JSF Tools Project | © 2008 by Oracle Inc; made available under the EPL v Deep dive into JSF web application development Build a typical JSF web application and get an in-depth understanding of the features in the JSF Tools Project  Build scalar forms  Build a tabular form  Explore syntax and semantic validation  Use Resource Bundles  Enhance Look and Feel  Run, debug the application

48 Building JSF applications with the JSF Tools Project | © 2008 by Oracle Inc; made available under the EPL v Build Scalar Forms Use the Web Page Editor to build JSF-JSP pages  Drag and Drop components from the palette  Set the value of properties of a component  Use Property View to add non-visual child component  Navigate to the parent, child of a component  Use the Source Editor  Get a preview of the page

49 Building JSF applications with the JSF Tools Project | © 2008 by Oracle Inc; made available under the EPL v Build a Tabular Form Use the Web Page Editor to build a form with the Data Table component  Add the Data Table component to a page  Add columns  Using the Context Menu, the Properties View and Drag and Drop from the palette  Select a column  By direct interaction with the designer canvas, Using the Context Menu, Using the Outline View  Move a column by Drag and Drop and Using the Outline View  Add Table Header and Footer

50 Building JSF applications with the JSF Tools Project | © 2008 by Oracle Inc; made available under the EPL v Enhance Look and Feel Use CSS styles to give a uniform Look and Feel for the application  Explore the CSS Style Editor in the Visual Page Designer  Set inline styles for components  Use style classes  Use the Preview page to get instant feedback

51 Building JSF applications with the JSF Tools Project | © 2008 by Oracle Inc; made available under the EPL v Run the Application Deploy and Run the application on the Tomcat server Debug deployment, application errors

52 Building JSF applications with the JSF Tools Project | © 2008 by Oracle Inc; made available under the EPL v Demo: What’s new in the JSF Tools Project?

53 Building JSF applications with the JSF Tools Project | © 2008 by Oracle Inc; made available under the EPL v Support for the Apache MyFaces Trinidad Tag Library

54 Building JSF applications with the JSF Tools Project | © 2008 by Oracle Inc; made available under the EPL v Support for Alternate View Description languages Pluggable design-time support for alternate view description languages. JSF Facelets Tools Incubator Project  Facelets is not part of the current version of the JSF specification, JSF 1.2  Facelets-like view handler planned for JSF 2.0 (JSR – 314)  Incubator project will enable current features of the JSF Tools Project in a dynamic web project for Facelets

55 Building JSF applications with the JSF Tools Project | © 2008 by Oracle Inc; made available under the EPL v JSF Facelets Tools Incubator Project Supported Features In the HTML Editor  Tag content assist  Tag attribute name content assist  Static value content assist for JSF attributes  EL content assist  EL hover support for bean variables  EL hyperlink for bean variables and properties  Validation for both static and EL values

56 Building JSF applications with the JSF Tools Project | © 2008 by Oracle Inc; made available under the EPL v Tag Content Assist

57 Building JSF applications with the JSF Tools Project | © 2008 by Oracle Inc; made available under the EPL v Attribute Name Content Assist

58 Building JSF applications with the JSF Tools Project | © 2008 by Oracle Inc; made available under the EPL v Static value content assist for JSF

59 Building JSF applications with the JSF Tools Project | © 2008 by Oracle Inc; made available under the EPL v EL content assist

60 Building JSF applications with the JSF Tools Project | © 2008 by Oracle Inc; made available under the EPL v EL hover help

61 Building JSF applications with the JSF Tools Project | © 2008 by Oracle Inc; made available under the EPL v EL hyperlink

62 Building JSF applications with the JSF Tools Project | © 2008 by Oracle Inc; made available under the EPL v Validation

63 Building JSF applications with the JSF Tools Project | © 2008 by Oracle Inc; made available under the EPL v Summary The JSF Tools Project adds comprehensive support to the Web Tools Platform Project to simplify development and deployment of JavaServer Faces applications

64 Building JSF applications with the JSF Tools Project | © 2008 by Oracle Inc; made available under the EPL v Resources JSF Tools Project Home  JSF Tools Project Wiki  Feedback  Newsgroup: eclipse.webtools.jsf  Mailing list:  Bugzilla: https://bugs.eclipse.org/bugs/enter_bug.cgi?product=Java%20Server%20Faces https://bugs.eclipse.org/bugs/enter_bug.cgi?product=Java%20Server%20Faces

65 Building JSF applications with the JSF Tools Project | © 2008 by Oracle Inc; made available under the EPL v Q&A


Download ppt "Building JSF applications with the JSF Tools Project | © 2008 by Oracle Inc; made available under the EPL v1.0 1 Eclipse Web Tools Platform – Uncovered."

Similar presentations


Ads by Google