RSS Feed
Download our iPhone app
Browse DevX
Sign up for e-mail newsletters from DevX


Face Up to Web Application Design Using JSF and MyFaces

JavaServer Faces provides an alternative to Struts or Spring MVC for those who want a Web application framework that manages UI events in a Java Web application. JSF is now a standard part of the J2EE specification and provides a viable alternative to non-standard Web frameworks.

f you've worked on more than one Web application with different teams, you've probably worked with more than one Web application framework. J2EE always provided Web technologies, but never defined a Web application framework for managing page navigation, request lifecycle, request validation, etc. Developers had to develop these features themselves or utilize one of many open-source frameworks such as Struts and Spring MVC. Enter JavaServer Faces.

JSF is specified in JSR 127 (see Related Resources section in the left column) and "defines an architecture and APIs that simplify the creation and maintenance of Java Server application GUIs." This article will discuss the basic ideas behind JavaServer Faces and then show you an example using the Apache MyFaces JSF implementation.

What is JavaServer Faces?
JavaServer Faces (JSF) is a Web application framework that can be used to link and manage user interface events. A JSF application is just like any other Java Web application in that it runs in a servlet container (such as Tomcat, WebLogic, WebSphere, etc.).

JSF is different than most Java Web-application frameworks, such as Struts, which treat each page request as a single event. JSF pages are comprised of multiple components that can each trigger individual events. Each component represents one or more Web page elements capable of generating dynamic output or providing user input. In JSF parlance, an individual component such as a text box or a button is said to be a simple component. A compound component is one that is comprised of multiple elements such as a table. The JSF component model is similar to the component model that traditional non-Web MVC frameworks such as Swing use. One benefit of this component model is that it should foster the creation of development tools that allow user interface designers to drag and drop components into a layout. Then, after creating a visual layout of the components, the developer(s) can write event-handling code that will allow the view components to interact with the application model. This could allow for faster GUI creation for prototyping and while doing rapid application development (RAD).

Other Web frameworks are usually tightly coupled to JSP as the view-rendering technology, but JSF is not bound to JSP. JSF calls for a strict decoupling of components from their view rendering. Rendering is done by using a rendering kit. JSP is a required rendering kit specified in the JSF specification and can be used to render JSF components into HTML, but developers can also use custom rendering kits to render views.

At the time of writing this article, there were a few JSF implementations available for use: a reference implementation available from Sun, Apache MyFaces, Smile, and ECruiser. Thus far, it looks like Apache MyFaces is the most widely used (or at least most widely referenced) implementation, so I'll use it for my example.

HiLo Example
I'm going to show you an example JSF application using the MyFaces JSF implementation and JSP as the rendering technology. I will create an application that will play HiLo with you. HiLo is a game where the computer picks a random number and you must guess what the number is. Each time you guess, it will tell you if you've guessed too high or too low, until you guess the exact number.

The application will have a greeting screen that will ask you your name and the highest possible number that the computer can pick. After submitting this page, you will go into the main game page where you can start guessing numbers. If you guess a number that is out of range, it will give you an error. The game will keep a count of how many guesses you've made.

In order to run the application, you'll need to have a Servlet engine. I wrote and tested the example using Tomcat 5.0.28 and the MyFaces 1.0.7. Unfortunately, I could not get MyFaces to work with Tomcat 5.5, though I was able to get a few JSF examples to work on Tomcat 5.5 using Sun's reference implementation.

What You Need
You can download Tomcat and MyFaces from the following Web sites:

Author's Note: If you want to try the Sun reference implementation, you can download it at http://java.sun.com/j2ee/javaserverfaces/download.html.

The code for the application (download it here or from the link in the left-hand column) is packaged as a war file with source code included, so you can deploy the application immediately to see it in action, and you have the source available so that you can look through it. The war file includes all the jar files from the MyFaces distribution.

Close Icon
Thanks for your registration, follow us on our social networks to keep up-to-date