Understand the available JSF (JavaServer Faces) development tools

JavaServer Faces

JavaServer Faces is a technology that helps you build user interfaces for dynamic Web applications that run on the server. The JavaServer Faces framework manages UI states across server requests and offers a simple model for the development of server-side events that are activated by the client. JavaServer Faces is consistent and easy to use.

The JavaServer Faces technology includes the following features:

JavaServer Faces, like JSP, is used to build form-based Web applications. JavaServer Faces is based on a model-view-controller (MVC) framework. For JavaServer Faces, this means that the controller is a servlet, the model is represented by JavaBeans, and the view comprises JavaServer Faces components with little or no application code. The goal of this model is to separate content from presentation.

Creating Faces applications - overview

Though there are several Web technologies that you can work with to create dynamic Web applications, JavaServer Faces gives you the ability to create form-based applications easily. Several views allow you to easily implement JavaServer Faces technology in your Web application: the Page Data view (shows the defined data sources), the Faces Components drawer in the Palette view (lets you easily add UI components and define data sources together for the page), and the data drawer in the Palette view (lets you define new data sources and drag data components such as JavaBeans and relational record lists to the page).

Here are the main steps in creating Faces applications:

  1. Create a dynamic Web project. The Web project is the container for all of your Web application resources. (Note that Faces JSP files can be contained only within a J2EE 1.3 or a J2EE 1.4 dynamic Web project.) If you add any Faces resources to your Web project, the Faces tooling is automatically enabled.

    NOTE: The Service Data Objects (SDO) data access framework, which enables you to access relational databases, is only available if you are targeting a WebSphere Application Server version 5.1 or version 6.0. If you try to use SDO, you will be prompted to target your application to the correct server. If your application is targeted to a different server, you should use data access beans as your data access method.

  2. Create Faces JSP files in that project. A Faces JSP file becomes a Web page in your dynamic Web project.

  3. Add data components to your Faces JSP file. From the Data drawer on the Palette view, drag a component to your Web page. You can add general data components, such as Java beans or Web services, or you can add relational database records.

    • There are two relational record components you can work with:

      • A single relational record: This component returns a single relational record and the properties of the record are generally bound to input or output components.

      • A relational record list: This component returns a list of relational records and can be bound to a data table or other component. It can also display elements from a JavaBean array and be bound to a JavaBean array.

      The advantage of using relational records and relational record lists is that you can retrieve, create, update, or delete information from a relational database and that this information can optionally be bound for display to the end user.

    • If you want to use Java beans or Web services, drag these items from the Page Data view or from the Data drawer on the palette.

    By default, when you add a data component from the palette, two things happen:

    • The data source is defined (and appears in the Page Data view).

    • The appropriate Faces components are added to the page for use with the defined data sources.

      These Faces components are bound to the defined data source. For instance, a data table may be added to a Web page if a relational record list is used. A table of components may be added to a Web page if a relational record is used. Each field in the relational record is represented as a row in the table. The components that are contained within each row depend on the types of data being added and how the user intends to use the relational record within the Web page (that is, for creating, updating, or displaying).

  4. Continue to design your page by dragging other Faces components from the palette to the page. You can drop components such as input fields, command buttons, hyperlinks, tabbed panels, and media players.

    Note: The following browsers are supported for displaying Faces components: Microsoft Internet Explorer 5.5 or above, Mozilla 1.3 or above, or Netscape 6.1 or above.

  5. Edit the properties for each component. When you have focus on a component in the Design or Source page of Page Designer, the Properties view displays the properties available for that component. If you add a Faces component directly from the palette, you can bind the component to a defined data source in the Properties view for the component.

  6. Use the Quick Edit view to add scripted events to your Web pages. For example, you can assign actions to Faces components in your Faces JSP file.

  7. Test your JSP files periodically as you develop your pages using Faces components. Because Faces components use dynamic data, you should run on server to preview. The preview page (located on the tab at the bottom of the Faces JSP file) will not be as accurate.

  8. Run the Web project on the server. In the Project Explorer, right-click on the file and choose Run > Run on Server. Refer to the server documentation to learn more about testing and deploying your Web application.

At run time, HTML and form tags are produced. After the Web application is deployed, the user can access and manipulate data directly from the Web application.

Note: This article is translated to Serbo-Croatian language by Jovana Milutinovich from Web Geeks Resources.

Professional hosting     Belorussian informational portal         Free SCBCD 1.3 Study Guide     Free SCDJWS 1.4 Study Guide     SCDJWS 1.4 Quiz     Free IBM Certified Associate Developer Study Guide     Free SCJP 5.0 (Tiger) Study Guide     Free Mock Exam Engine     Free SCWCD 1.4 Study Guide     IBM Test 000-287. Enterprise Application Development with IBM WebSphere Studio, V5.0 Study Guide