Introduction to Facelets


Facelets Project

The course is part of this learning path


In this course, we explore the fundamentals of Facelets and then show you a practical example of the creation of a Facelets project. We will also look at the concept of composite components within Facelets.

Learning Objectives

  • Obtain a foundational understanding of Facelets and composite components
  • Create a Facelets project

Intended Audience

This course is intended for anyone who already has basic knowledge of Java and now wants to learn about Java EE 6, with a particular focus on Facelets.


Basic knowledge of Java programming.



Hello dear friends. In this video, we will start to Facelets. Let's begin. Before we begin, I'd like to mention that I'll be examining Facelets in the next two videos. In this video, I will explain everything about Facelets and in the second video, we will create a small project using Facelets. Let's get going. First, open Look at the menu items and photo area. Now select any item. Look, again there's no changes in menu or photo area. In any website, you can see these parts. 

In Java, the meaning of Facelet refers to these areas. In any template, you can see a blank page like Metronic or Admin LTE. Now, I think that's enough. We can now move to the definition of Facelets. Facelets is a powerful but lightweight page declaration language that is used to build JavaServer Faces using HTML style templates and to build component trees. Facelets uses XHTML for creating webpages and supports Facelets tag libraries in addition to JavaServer Faces and JSTL tag libraries. Also, Facelets supports the expression language as EL and uses templating for components and pages.

Advantages of using Facelets for large-scale development projects are: Support for code reuse through templating and composite components, functional extensibility of components and other server side objects through customization, faster compilation time, compile-time EL validation, high-performance rendering. Basically, the use of Facelets reduces the time and effort that needs to be spent on development and deployment. Facelets views are usually created as XHTML pages. JavaServer Faces implementations support XHTML pages created in conformance with the XHTML transitional document type definition. JavaServer Faces technology supports various tag libraries to add components to a webpage. These include: JavaServer Faces Facelets Tag library, JavaServer Faces HTML tag library. JavaServer Faces core tag library, JSTL core tag library, and JSTL functions tag library. You can also see the example tags like UI component or h input text.

The JavaServer Faces specification defines the lifecycle of a JavaServer Faces application. Let's look at the lifecycle of Facelet. When a client such as a browser makes a new request to a page that is created using Facelets, a new component tree or Java X faces component UI view route is created and placed in the faces context. The UI view route is applied to the Facelets and the view is populated with components for rendering. The newly built view is rendered back as a response to the client. On rendering, the state of this view is stored for the next request. The state of input components and form data is stored. The client may interact with the view and request another view or change from the JavaServer Faces application. At this time, the saved view is restored from the storage state. The restored view is once again passed through the JavaServer Faces lifecycle which eventually will either generate a new view or re-render the current view, if there were no validation problems and no action was triggered.

If the same view is requested, the stored view is rendered once again. If a new view is requested, then the process described, the UI view route is applied to the Facelet step. The new view is then rendered back as a response to the client. Now, let's talk about Facelet templates. Template is a tool which provides the facility to implement the user interface. Templating is a useful Facelets feature that allows you to create a page that will act as the base for other pages in an application. By using templates, you can reuse code and avoid recreating similar pages. Templating also helps in maintaining a standard look and feel in an application with a large number of pages. Now, let's look at the most useful tags that are used in templating. First one is UI component. UI component is used to define a component that is created and added to the component tree. UI composition is used to define a page composition that optionally uses a template.

Content outside of this tag is ignored. UI debug is used to define a debug component that is created and added to the component tree. UI decorate is similar to the composition tag but does not disregard content outside this tag. UI define is used to define content that is inserted into a page by a template. UI fragment is similar to the component tag but does not disregard content outside this tag. UI include is used to encapsulate and reuse content for multiple pages. UI insert is used to insert content into a template. UI param is used to pass parameters to an included file. UI repeat is used as an alternative for loop tags, such as C for each or h data table. UI remove is used to remove content from a page. We will use some of them in our Facelet project. That's all I have for now. So, let's take a little break here. In the next video, we will create a little Facelet project. See you in the next video.


About the Author
Learning Paths

OAK Academy is made up of tech experts who have been in the sector for years and years and are deeply rooted in the tech world. They specialize in critical areas like cybersecurity, coding, IT, game development, app monetization, and mobile development.

Covered Topics