JSF Tutorial

  • Share this blog:


An MVC(model view controller) web framework which eases the construct of UI(User Interface) for server-based applications by utilizing reusable components of UI within a page. JSF allows connecting with the event handlers on the server-side and to the data sources of UI widgets. JSF gives an API(Application Programming Interface) and also presents a set of conventional UI components for building more components. JSF facilitates the extension of current conventional UI components and also permits reuse.

JSF gives the components like command button, input text and so on. JSF serves to maintain their states. JSF also facilitates data conversion, server-side validation, extensibility, describes page navigation, accessibility and internationalization.

Tag libraries of JSF utilized to connect the components with the server objects and also add the components upon the webpages, JSF has the tag handler which executes the component tag.

Simply JSF is just like AWT and Swing, JSF is also a development framework that gives a group of reusable and standard GUI components.

Advantages of using JSF

Using JSF decreases the energy of developers while designing and managing the applications, these applications operate on Java server also administer the application UI upon to the destination client.

  • JSF Gives reusable UI components.
  • Data transfer among UI components becomes easy.
  • Custom components implementation is enabled.
  • JSF Wires the client-side request to the server-side.
  • JSF Clear separation of presentation and behaviour.
  • JSF Gives standard and multiple merchant implementations. 
  • JSF is a fine-tuned event model which lets applications to be 

JSF version history



Release Date


JSF 1.0


This is an initial release.  

JSF 1.1


There are no specific changes in this release; it is just a bug-fix release.

JSF 1.2


It has several enhancements over core systems and APIs. Matches with Java ee 5. original selection within java ee.

JSF 2.0


JSF 2.0 is a huge release for ease of utilization, enhanced performance and functionality this version matches with JAVA ee6.

JSF 2.1


It implied a maintenance announcement 2 of JSF 2.0. simply a pretty lesser amount of stipulation modifications.

JSF 2.2


It has launched modern theories like page flow, stateless views and the capability to generate portable support arrangements.

JSF LifeCycle:

JSF contains SIX phases in the life cycle of JSF. 

  1. Restore view this is the initial phase of the JSF life cycle, JSF begins this restore view phase as soon as the button snap. In this phase, JSF builds validators ti UI components, JSF builds the view and wires the event handlers and stores the view within the FaceContext instance. This FaceContext instance will now have all the data that is needed to develop a request.
  2. Apply request value this is the second phase in the JSF lifecycle after the component restored every component within the component tree utilizes the decode method to extract its brand new value from the request parameters.
  3. Process Validation in the phase JSF will process all the registered validators of the component tree. It explores the component attribute protocols and also minimizes these protocols to the local value saved within the component.
  4. Update model values after inspecting the data JSF moves to the moves to the component tree and to the components’ local values it fixes the identical server-side object properties. Then to the input component value attributes the JSF will update the bean properties.
  5. Invoke application in this phase JSF handhold any application-level activities such as submitting a form to another page and also linking to another page
  6. Render response this is the last phase of the JSF life cycle. In this phase, JSF asks the application server to interpret the page if the application is utilizing the JSP pages. These components depicted on the page will be combined with the component tree while JSP container executes that page. If that is not an introductory request, then the component tree will be present, so there is no need to add the components again. 

JSF basic tags:




HTML input_ type=”text”, textbox.


HTML input_type=”password”, textbox.


this is the field of HTML Textarea


HTML input_type=”hidden”


a individual HTML check box will be rendered


A set of HTML checkboxes will be rendered


An individual radio button will be rendered 


An individual Listbox will be rendered 


Various Listboxes will be rendered


An individual combo box will be rendered


A text of HTML will be rendered


This accepts parameters and also a text of HTML will be rendered


An image will be rendered by using this tag


By using this tag we will be including a CSS style sheet within the HTML output


A script is added within the HTML output by using this tag

JSF Converter tags:




By using this tag we can convert the string into the number of the required format


By using this tag we can convert the string into the desired date format

JSF validator tags:




We can validate the length of the string by using this tag


By using this tag we can validate the rage of a numeric value


By using this tag we can validate the range of float value


We can validate the regular expression of a JSF component

JSF MVC Design:

MVC is abbreviated as Model View Controller design gives a set of scheme patterns that assists you to divide the areas of interest that are involved in constructing and executing GUI applications 

  • The model encapsulates(hides) the endurance code and enterprise logic for the application this design should be the same as the view technology.
  • The view must have the presentation logic and also showcases the model objects, and this view should neither show the enterprise logic nor any controller logic.
  • The controller is a mediator among the model and the view; the controller first communicates with the model and then passes this model objects to the view which displays them. 

MVC Implementation:

In JSF MVC implementation within backing, beans act as a mediator among the view and the model. Because of this, it is necessary to restrict the persistence logic and business logic within the backing beans. One similar option is to empower business logic to a facade that serves essentially as the model.  

JSF view implementation is not like JSF technology; JSF view implementation is a component model of statefulness. The JSF view constituted of two sections. They are the JSP pages and view root.

  1. The JSP page fixes UI components over JSP pages and permits us to unite field components to qualities of backing beans.  
  2. The view root is a combination of UI state and UI components that manage the UI state. 

Request processing Lifecycle of JSF:

There are six phases in the request processing life cycle of JSF.

  1. Restore component model: The controller checks the request and concretes the view ID which is detected by JSP page name if the view is not already present then the JSF controller build it, it the view is already present then the JSF controller utilizes it the view will have all the components. 
  2. Apply request values: each component utilizes the apply request value phase to regain the components contemporary(current) state the values of components are regained from request parameters.
  3. Process validation: in this phase, every component holds its values verified against the application validation protocols.
  4. Update model: this phase, the server-side model values are updated; this can happen only by updating the backing beans properties.
  5. Invoke Application: The controller of JSF invokes the application to manage Form resignations. The component values will be switched, validated, and implemented over the model objects. Therefore we can instantly utilize them to administer the business logic of the application.
  6. Render response: this shows the view and all the components of view and their current state, and later execute the page furthermore transfer it back to the customer.

Standard UI components of JSF:

There are 12 JSF UI components.

  • UIInput
  • UISelectBoolean
  • UIOutput
  • UISelectMany
  • UISelectItem
  • UISelectOne
  • UICommand
  • UIGraphic
  • UIPanel
  • UIData
  • UIColumn
  • UIForm

Characteristics of JSF: 

  • JSF is a framework which depends on the components.
  • JSF combines with the language called expression language.
  • The JSF implements Facelet technology.
  • JSF upholds HTML5.
  • Internationalization is supported by JSF.
  • JSF makes web development easy.
  • By using JSF, we can Rapidly develop web pages.
  • Bean Annotations
  • Templating is the important feature of JSF
  • Exception handling is the default in the JSF
  • JSF has a better security
  • AJAX support is Inbuilt

Navigation Rules:

Navigation rules are the protocols that are given by the JSF framework that defines which view should be displayed whenever a link or a button clicked. These protocols can be described within the configuration file of JSF, which is named as faces-config.xml. These can be described within the managed beans. Navigation rules will have the conditions which are based on the resulted view.


Internationalization is a technique within which currency, status messages, date and GUI component labels are not impended within the program rather they are saved outside the source code that is present within resource bundles, and they are retrieved dynamically.

There are three steps to internalize the JSF application.

  1. Property files are defined.
  2. Faces-config.xml is updated
  3. Resource-bundle var is utilized.   

Method and value Binding:

Within JSF, we can obtain some values like a managed bean through value binding. As value binding, the universal(EL) Expression Language is practised to obtain bean or/and methods, Meanwhile, in JSF we do not require to define the set() or get() methods but simply the mane of a variable. Method binding can be utilized to wrap a JSF component, for example, a link over a method of the Java class.

Prerequisites to utilize JSF:

To utilize JSF, we just need 

  • Implementation of JSF.
  • Tag libraries of the JSTL. 
  • The runtime environment of JAVA.
  • And finally, a Web container in which we can use JSF.

Why JSF is not so popular:

There are a lot of implementations of JSF like richfaces and primefaces which makes JSF difficult to the client to learn, comprehend and adapt to where the Spring MVC possesses hardly one implementation supported by a particular assortment of developers which eludes trouble. 

Spring has prepared comprehensive combination including data management within ORM frameworks or standalone outside the case which is requiring in JSF implementation.


JSF is a component-based framework where a Spring is a client-server based framework. Therefore, it is simple to learn and correlates intimately to Struts2, MVC and few another comparable framework.


You liked the article?

Like : 0

Vote for difficulty

Current difficulty (Avg): Medium

Recommended Courses


About Author
Author Bio

TekSlate is the best online training provider in delivering world-class IT skills to individuals and corporates from all parts of the globe. We are proven experts in accumulating every need of an IT skills upgrade aspirant and have delivered excellent services. We aim to bring you all the essentials to learn and master new technologies in the market with our articles, blogs, and videos. Build your career success with us, enhancing most in-demand skills in the market.

Stay Updated

Get stories of change makers and innovators from the startup ecosystem in your inbox