• USA : +1 973 910 5725
  • INDIA: +91 905 291 3388
  • info@tekslate.com
  • Login

JSF Tutorials

JSF Tutorials Overview

Welcome to JSF Tutorials. The intent of these tutorials is to gain in depth understanding of Java Server Faces (JSF) Specification.

JSF Introduction

JSF is exclusively designed for only presentation layers.




To design enterprise application we have to provide the following 3 Layers

Presentation Layers

Business processing layers

Persistence layer data storage and Access layers

Presentation Layers

The main purpose of presentation layers in enterprise appon is,

To improve look and feel for the enterprise appl n

To accept the data from user in order to execute enterprise application.

To perform client side data validations by using java script functions.

To specify deferent types at request like GET. POST… TO prepare presentation layer in enterprise applications. We have to provide a separate logic called as presentation logic.

To provide presentation logic, we have to we the tech like AWT, swing, HTML, JCP free market, velocity…

Business Processing Layer

It is the heart of enterprise appl n. it will provide very good env… To define and execute business rule and regulation what actually client required.

To prepare this layer, we have to provide business logic

To prepare Business logic in enterprise application development, we have to use the technologies  like servlet, Ejbs, Bean components.

Persistence Layer

This Layer main intention is to provide env. To interact with data base and to provide data persistence.

To prepare this layer in enterprise application, we have to use the tech. like JDBC, Hibernate, EJBS Entity Beans, JPA, Open JPA…..

System Architecture

To design enterprise application First we have to define the degree are height of the enterprise application on the basic at application Requirement

To define enterprise application height, we have to use system architecture


1-Tier Architecture

It will specify to design and execute enterprise application within a single machine i.e we have to provide presentation logic, business logic and persistence logic with in a single machine

In the above context, single machine me sources may not be sufficient to execute enterprise applicator.

1- tier architecture is suggestible for only stand alone application no1 for enterprise application

1-Tier architecture will not provide sharability

1-Tier architecture will provide . tightly coupled design for the enterprise application




2-Tier Architecture

This architecture is the conventional architecture.

This architecture will provide two layers of machines to distribute enterprise application.

If we design enterprise application in 2-tier architecture then we have to provide presentation logic tier-2 systems.

The best example for 2. Tier architecture is client- server arch.

2-tier architecture will provide loosely coupled design for the enterprise applications.

2 Tier architecture will provide multi users env

2 tier architecture will improve database shareability when compared with 1-tier architecture




3 Tier Architecture

This architecture will provide there layers of machine to distribute enterprise application.

In case of 3- Tier architecture , tier-1 systems will manage presentation logic, tier-2 systems will manage business layer and tier -3 systems will manage persistence layer

When compared with 1-tier arch and 2- tier arch., 3- Tier arch. Will improve data base sharability and application server components sharability.

3-tier architecture will provide more loosely coupled design for the enterprise application.

3- tier arch is the frequently used architecture for the enterprise application





It we increase no of tires in enterprise application their flexibility will be increased to design enterprise application but maintenance cost will be increased

Enterprise Applications using JSF

There are 2 types of enterprise application

  1. Web application
  2. Distributed applications

Differences between web applications and distributed applications

Web applications are the server side applications, which will be designed without distributing application logic over more than one JVM

Distributed applications are the java applications, which will be designed by distributing application logic over more than one JVM

Web applications will be designed by using web technologies like CGI, Servlet , JSPS

Distributed applications will be designed by using the technologies like socket programming, RMI,EJBS, CORBA, Web services.

In case of web application, no separate java program for client in case of distributed application, there is a separate java program fore client and fore server.

Web application is a collection of web components like servlet, JSPS,— which will be executed by using only web containers.

Distributed application is a collection of distributed components like EJBS, Which will be executed by using EJB Container.

Web applications will be executed by both web servers and application servers.

Distributed applications will be executed by only application servers.

Web applications will provide services for only web client is browser

Distributed application will provide services for only type of client.



In case of distributed applications, client may be any thing like a java program with main() method. An applet, a servlet, a JSP page, frame work specific components like action classes in struts and managed beans in JSF,

The main purpose at web application initially to general static response from server and distributed applications is to generate dynamic response.

At present the intention of web application to generate dynamic response from server machine and distributed application is to establish connection abut n local machine and remote machine in order to get remote services from remote machine

It we want to use more web application and distributed application with in a single enterprise application then we will use web application to  implement presentation  and part we will use distributed application to implement business logic.


Web application development models

To design web application in a standard pattern, we have to use the following models.

1.Model I Architecture

2.Model II Architecture

Model I Architecture

In this architecture, a JSP page is a configure as controller, it will take responsibility to pick up requests clients and to control the entire web application

In Model Iarchitecture, a java bean component will be used as model part to execute application business logic

Model I architecture, is also called “JSP Front”, because a single JSP page is acting as front controller to requests and to control web application.

Model I architecture, is also called as page centric architecture, because a single JSP page is controlling the entire web application




In model-I Arch a single JSP page is acting as controller, to control the entire web application the existed JSP features will not be sufficient it required to code in JSP pages, providing java code inside JSP page is not suggestible

In model-I arch, there is no separation bet n presentation logic and controller logic, it may provide tightly coupled design for the web application.

To over come all the problems we have to go for model II Architecture.


Model –II Architecture

We will use a servlet as controller and a set of JSP pages as view parted

Model II architecture is also called as “Servlet front” because a single servlet is taking responsibilities to pick up all the request from client.

Model II architecture is also called as “Servlet control ”arch because a single servlet is controlling the complete web application.

Model II architecture is purely an implementation of MVC design pattern




Struts  a JSF like frame works are designed on the basis of model II web application architecture lie on the basis of MVC design pattern

JSF Overview


Java community process[Experts from IBM,SUN,..] SUN Me system Macle corporation


web application f/w


To Simplify and accelerate web app1


open source s/w

Initial version

JSF 1.0[2004,March]

Used version

JSF1.2[2006,May ]

Latest version

JSF2.x[2011 ]

Code supported


Designed platform

JAVA, Servlet, JSPS

JSF 1.0, JSF1.1 version are frameworks that are not the part of J2EE Technologies.

* JSF 1.2 version on wards it was included in J2EE Technologies.

*JSF 1.0 AND JSF1.1 are frame work but JSF 1.2 and JSF 2.x are Technologies

Java EE5 2 JSF 1.2…

Java EE6 2 JSF 2.x …

JSF is an abstraction provides by SUN, but it was implemented in two implementations.

1.SUN RI(Reference implementation)(by sun)

2.My Faces (by Apache)

JSF Component implementation are provided by some 3rd parley org.

  1. Prime Faces
  2. Rich Faces
  3. ICE Faces

JSF Services

I 18 N



Event Handling

Rend kit

Components tag library

Difference between JSF1.X &JSF 2.X


1.in JSF 1.X version config file is mandatory and annotation is not supports1.In this JSF config file is optional and in place of config file we are able to use annotations.
1)To represent managed bean metadata, we have to use the following annotations on the top of managed bean class


a) Managed bean(name=”—”)

Where ”name” member will take logical name of the managed bean class

This annotation will be pre presented by a predefined  interfaces javax.faces.bean. managed beam

2)@xxX scoped

Eg: @session scoped

@Application scoped

@page scoped

@Request scoped

This annotation can be used to represent a particular scope fore the managed bean

  1. ii) In JSF 1.X We are able to use only JSP pages to prepare user interface

In JSF 2.x Version we are able to use both Jsp & xhtml pages to prepare users interface.

In case of JSF 1.X version Framework is using explicit navigation system, it must require navigation rules configuration in faces-config.xml file explicitly in order to forward request to target page

In case of JSF 2.X Version Framework has an implicit navigation system it should not require explicit “navigation rules” configuration from faces-config.xml file. It will forward request to  the target pages on the basis of the return value from action method defined in the respective managed bean component.


It the return value from action method is “success” then implicit navigation system will forward request to either success jsp or success. Xhtml file.

In case of JSF 1.X version support is available but we have to provide some explicit configuration. In case of JSF 2.x version supported is inbuilt, it shouldn’t require any explicit configuration.

In JSF 1.x Version face lets tag library is not good in JSF 2.X Version, face lets supported cs very good to provide compositions.






<html xmlns=http://www.w3.org/1999/xhtml


Xmln:h=”http:java.sun.com/jsf/html” >



<h:panel grid columns=”2”>

<h: output text value=”user name”/>

<h:input text id=”u name”value=#{user bean. Uname”/}

<h:command button value=”say hello” action=#{user bean say hello}”/>





<html xmlns=”http//www.w3.org/1999/xml”





<h:output text value=”Hello—-”/><h:output text value-

“#{userBean.u name}”/>




User Bean.java

Package com. soft

Import javax. faces. bean. managed beans;

Import javax. faces. bean. Session scoped;

@managed bean(name=”user bean”)

@session scoped

Public class user Bean{

Private string uname;

Public setting getuname(){

Return u name;


Public void set u name(String uname){

This. U name=u name;


Public string say Hello(){

Return ”wish”;





//same as prev.example



<servlet-name>faces servlet</servlet-name>

<servlet-class>javax.faces.webapp. faces servlet</servlet class>


< /servlet >


<servlet-name>faces servlet</servlet-name>





Contact US

Need an Instructor Led Training, Contact Us


Please leave a message and we'll get back to you soon.

I agree to be contacted via e-mail.