An introduction to creating JSF applications in Rational Application Developer Version 8.0

Transcription

1 An introduction to creating JSF applications in Rational Application Developer Version 8.0 September 2010 Copyright IBM Corporation

2 Overview Although you can use several Web technologies to create dynamic Web applications, JavaServer Faces (JSF) gives you the ability to create form-based applications easily. You can implement JavaServer Faces technology in your Web application by using different views. Use the Standard Faces Components and Facelet Tags drawers in the Palette view to add user interface (UI) components and define data sources for the page. Use the Data and Services drawer in the Palette view to define new data sources and drag data components such as JavaBeans beans and relational record lists to the page. The Page Data view shows the defined data sources. What is JavaServer Faces? JavaServer Faces (JSF) is a framework for developing Web applications. It simplifies the construction of user interfaces (UI) for server-based applications by enabling the assembly of reusable UI components in a page. JSF facilitates the connection of widgets to data sources and to server-side event handlers. The JSF framework unifies techniques for simplifying Web application design and development by addressing the following Web application design and development concerns: User interface development JSF allows direct binding of user interface (UI) components to model data. It abstracts request processing into an event-driven model. Developers can use extensive libraries of prebuilt UI components that provide both basic and advanced Web functionality. Navigation JSF introduces a layer of separation between business logic and the resulting UI pages; stand-alone flexible rules drive the flow of pages. Session and object management JSF manages designated model data objects by handling their initialization, persistence over the request cycle, and cleanup. Validation and error feedback JSF allows direct binding of reusable validators to UI components. The framework also provides a queue mechanism to simplify error and message feedback to the application user. These messages can be Copyright IBM Corporation

3 associated with specific UI components. Internationalization JSF provides tools for internationalizing Web applications, supporting number, currency, time, and date formatting, and externalizing of UI strings. JSF is easily extended in a variety of ways to suit the requirements of your particular application. You can develop custom components, renderers, validators, and other JSF objects and register them with the JSF runtime. JavaServer Faces specification JavaServer Faces was created by Java Specification Request (JSR) 127. JSR 127: JavaServer Faces 1.0, defines a standard set of JSP tags and Java classes that simplify the development of Web application user interface (UI). JSR 252: JavaServer Faces 2.0, is the latest version of the JavaServer Faces specification. JavaServer Faces was created by Java Specification Request (JSR) 127: JavaServer Faces. IBM, Sun, and BEA, along with many other industry leading companies participated in the development of the specification. The JSR 127 Expert Group owns and maintains the JSF specification, however, anyone can contribute to the specification and provide feedback. IBM provides its own implementation of the JSF specification as well as providing extensions to the framework in accordance with the specification. Extensions include custom UI controls. What's new in JSF 2.0 In JSF 2.0, Facelets 2.0 is the standard view decoration language for JSF application development. It is not recommended to combine Faces JSP and Facelets in the same project. Facelets provides a lightweight template framework that is designed for component reuse and ease of development and maintenance. Facelets offers the following features to help you create robust, flexible, and extensible user interfaces: Templates to define layout Composite components, so that you can turn a page into a JSF UI component Custom logic tags Copyright IBM Corporation

4 Expression functions and validation Component libraries XHTML page development The JSF tools in Rational Application Developer fully supports JSF 2.0 and Facelet development. You can create Facelet pages and templates, drag and drop Facelet UI components from the palette to your page, and edit the component attributes in the Properties view. Other new features of JSF 2.0 include: Configure managed beans using annotations instead of XML Support for relocatable resources. You can specify the location in the page where you want the resource to be placed, using the target attribute. Native AJAX support to make AJAX calls with the <f:ajax> tag Bookmarking support for links and buttons with the <h:link> and <h:button> tags Simplifed implicit navigation handling Support for HTTP GET requests with view parameters Partial state-saving mechanism Support for global system events and component system events View scope state and flash scope state Improved validation and error handling JavaServer Faces life cycle Each JavaServer Faces request that renders a JavaServer Pages (JSP) page involves a JavaServer Faces component tree, also called a view, and goes through a request processing life cycle made up of phases. The standard phases of the request processing life cycle begin with building the restore view, applying request values, processing validations, updating model values, and invoking the application. Copyright IBM Corporation

5 Build restore view The JavaServer Faces component tree is used to build and maintain state and events for the page. The tree is built once every session and reused when users return to the page. At the end of this phase, the root property of the FacesContext instance for the current request reflects the saved configuration of the view generated by the previous faces response, if there is one. Apply request values The purpose of applying request values is to give each component the opportunity to update its current value using the information included in the current request, such as parameters, headers, and cookies. Process validations As part of the creation of the view for this request, zero or more validator instances can be registered for each component. In addition, component classes themselves can implement validation logic in their validate() methods. At the end of this phase, all configured validations are completed. Validations that fail cause messages to be enqueued via calls to the addmessage() method of the FacesContext instance for the current request, and the valid property on the corresponding components are set to false. If any of the Copyright IBM Corporation

6 validate() methods that were invoked called responsecomplete() on the FacesContext instance for the current request, the life-cycle processing of the current request must be immediately terminated. If any of the validate() methods that were invoked called renderresponse() on the FacesContext instance for the current request, control must be transferred to the Render Response phase of the request processing life cycle. The same conditions are true for an event listener that processed a queued event. If none of these conditions occurs, control proceeds to the next phase to update model values. Update model values If this phase of the request processing life cycle is reached, it means that the incoming request is syntactically and semantically valid according to the validations that were performed, the local value of every component in the component tree has been updated, and it is now appropriate to update the application's model data in preparation for performing any application events that have been queued. Invoke application As described when building a restore view, if the view for the current request was reconstructed from state information saved by a previous request, the JavaServer Faces implementation will have ensured that the ActionListener returned by calling getactionlistener on the Application object for this Web application will be registered with all UICommand components in the component tree, by virtue of the restorestate() method. Render response This phase accomplishes two things at the same time: causes the response to be rendered to the client, and causes the state of the response to be saved for processing on subsequent requests. The reason for handling both of these responsibilities in one phase is because the act of rendering the response in JSP applications can cause the view to be built as the page renders. Therefore, the state of the view cannot be saved until after it is rendered to the client. Event Processing During several phases of the request processing life cycle, events can be queued, for example, via a call to the queueevent() method on the source UIComponent instance, or a call to the queue() method on the FacesEvent instance. These queued events must now be broadcast to interested event listeners. The broadcast is performed as a side effect of calling the appropriate life-cycle management method (processdecodes(), processvalidators(), Copyright IBM Corporation

7 processupdates(), or processapplication()) on the UIViewRoot instance at the root of the current component tree. For each queued event, the broadcast() method of the source UIComponent will be called to broadcast the event to all event listeners who have registered an interest on this source component for events of the specified type. A Boolean flag is returned indicating whether this event has been handled completely and whether the JavaServer Faces implementation can remove it from the event queue. It is also possible for event listeners to cause additional events to be queued for processing during the current phase of the request processing life cycle. Such events must be broadcast in the order they were queued after all originally queued events are broadcast, but before the life-cycle management method returns. Model-view-controller architecture The JSF framework implements the Model-View-Controller (MVC) architecture ensuring that applications are well designed and easier to maintain.. According to the MVC pattern, a software component is separated into layers along the following lines: Model View Controller Encapsulates the information (data) and the methods to operate on that information (business logic). Managed beans define the model of a JSF application. These Java beans typically interface with reusable business logic components or external systems, such as a mainframe or database. Presents the model. JSPs make up the view of a JSF Web application. These JSPs are built using predefined and custom-made UI components and by connecting these components to the model. Processes user events and drives model and view updates. The Faces servlet, which handles the request processing lifecycle defined by JSF, drives the application flow. With JSF, Java programmers to focus on backend data encapsulation development that is then integrated with the UI. With JSF, Web page creators can create the user interface by assembling prebuilt JSF components that Copyright IBM Corporation

8 already contain the necessary logic. JavaServer Faces development JSF supports the creation of user roles in the development cycle through its implementation of MVC architecture. MVC architecture supports the separation of business logic into distinct parts. Each part is the responsibility of a different user role. JSF development user roles A user role is the classification of a user as having a specific set of tasks which are executed using a specific set of skills. These user roles allow for the parallel distributed development of the Web application. The basic JSF development user roles are: Application developer Copyright IBM Corporation

9 These users create the business logic, or model, of the application. They provide object-oriented access to backend data, manage persistence of the model, and expose interfaces for common backend tasks. They must have Java skills and knowledge of any backend integration. Component developer These users create reusable JSF components, such as UI components, renderers, and validators. They are responsible for encoding the data from the application developer's interfaces, as well as decoding the request information to update the model. They require skills in J2EE and JSF APIs. The JSF Widget Library (JWL), created by IBM and included in this product, does the work of the component developer by providing reusable JSF components. Web page developer These users are responsible for the look and feel, or view, of the application. They create Web pages using the components created by the component developer and the business logic and data objects created by the application developer. Typically these users own the navigation and model life cycle configuration. They require HTML, CSS, JavaScript, and other browser-based technology skills. JSF development cycle An application developer writes Java classes that provide an object-oriented interface for a set of tables in a database. The developer packages the code into a JAR file for use by the page developer. A page developer creates a new JSF-enabled Web application and imports the supplied JAR file from the application developer. The page developer creates a new JSF page for interfacing with the database and adds a class from the JAR to the page as a managed bean, then drags it onto the page. A set of fields are created with which to update the record. The page developers drags a command button onto the page from the Enhanced Faces drawer of the palette and associated it wit a supplied update method in the supplied business logic. The page developer adds navigation rules to display other pages based on the success of the update operation. Finally, the page is tested by running it on the application server. The end user accesses the Web application for the database application to update the database directly via a Web interface. Copyright IBM Corporation

10 Developing Web applications using JSF To create a Web application in Rational Application Developer that uses JSF: 1. Create a JSF enabled dynamic Web project. 2. Create a Faces JSP page or a Facelet page. 3. Add JSF UI components to the page. 4. Add data viewing components to the page. 5. Configure the properties for each component. 6. Assign actions to JSF UI components. 7. Test the Web project. 8. Run the Web project on a server. Tools for JSF development The Rational Application Developer JSF tools help you use JSF to develop Web applications more effectively. Page Data view The Page Data view allows you to add, modify, or delete data objects in JSP, HTML, and XHTML files. Supported data types include: Standard scripting variables that are available to all JSP files: applicationscope enables you to add and modify attributes in the application object param enables you to add and modify attributes to be used in the page object requestscope enables you to add and modify attributes in the request object sessionscope enables you to add and modify attributes in the session object Other data objects, depending on the type of file: Faces component Use Beans Page Bean Faces Managed Beans JPA SDO Relational Records Services RPC Adapter Services Copyright IBM Corporation

11 Properties view The Properties view displays specific information pertaining to the currently selected tag in a Web page. For example, the Properties view shows a variety of information about an HTML table tag. The Properties view lets you edit JavaScript and JSP tags while Page Designer is open in the Design or Split pane. When you edit in the Properties view, your changes take effect when cursor focus is changed. If you make changes to tags in the Source pane of Page Designer, the changes take effect immediately in the Properties view. Quick Edit view The Quick Edit view lets you add short scripts to your Web pages. For example, if you select a button tag on a JSP page, you can then associate a click event with that button and add a script to it. Validation You can validate your Web application to ensure that the syntax is correct and your markup is well-formed. A validator is a tool that checks that resources conform to a specification or set of rules. You can add and remove validators from your Web application. To configure what validators will run on a project, click Window > Preferences > Validation. The JSF validators include: JSF application configuration validator JSF view extended validator JSF view validator Content assist Content assist provides context-based proposals at the current text insertion point. A popup of possible tags and attributes are made available as you type. Content assist is available for most of the JSF tag library attribute values. JSF Palette Tools Drawer Description Example Copyright IBM Corporation

12 Standard Faces Components drawer (JSF 1.x and 2.0) The Standard Faces library, contains a basic set of JSF tags that are defined by the JavaServer Faces Technology specification. Enhanced Faces Components drawer (JSF 1.x) The Enhanced Faces Components drawer contains JSF Widget Library (JWL) tags, standard JSF tags, and some enhanced versions of standard JSF tags. Copyright IBM Corporation

13 Facelet Tags drawer (JSF 2.0) The Facelet Tags drawer allows you to drag and drop Facelet UI components onto a Web page. Data and Services drawer The Data and Services drawer allows you to drag and drop page data onto a Web page. Custom drawer or third party library A component library contains JSF components that you can use in your Web applications to create a user interface that connects to a data source. When you add support for a library, the library tags are added to the palette. Copyright IBM Corporation

14 JSF Wizards Wizard Faces Component Library Project Faces Custom Component Faces Definitions Project Faces Library Definition Description A custom component library contains new and modified JSF components that you can use in your Web applications and distribute the libraries to your development team. Use this wizard to create new JSF tags or modify existing JSF tags that you can use in your Web applications to create UI. Use this wizard to create a project that contains support information for existing JSF libraries. Use this wizard to add support for an existing JSF library. JSF project facets A project facet is a specific unit of functionality that you can add to a project when that functionality is required. When a project facet is added to a project, it can add natures, builders, classpath entries, and resources to a project, depending on the characteristics of the particular project. JSF facets define the characteristics of your JSF enabled Web application. The JSF facets specify the requirements and constraints that apply to your JSF project. JSF trace view and console In a JSF application every request from the browser goes through a complex series of steps before a response is generated. In a JSF application, this series of steps is known as the JSF Lifecycle. A number of conditions can influence which phases of the lifecycle are executed and therefore which phases are sent back to the browser in response to a request. It is difficult to see all of the steps in the JSF lifecycle when an application is run on server. JSF Trace gives you look into the running JSF application by collecting information about the JSF Lifecycle and presenting it in real time in an easy to understand form. When you add JSF Tracing support to an application, the Trace view collects and presents information about the JSF lifecycle of your application while your Copyright IBM Corporation

15 request is processed. In addition to the JSF Trace view, the JSF Trace console presents raw information received over the network socket from the running application. Copyright IBM Corporation

16 For more information To learn more about JSF and Rational Application Developer, see these resources: Rational Application Developer Web site: Rational Application Developer Information Center: Rational Application Developer wiki: Copyright IBM Corporation