1. Home
  2. Training Library
  3. Programming
  4. Programming Courses
  5. Building Web Applications with Java EE 6

First JSF Project



The course is part of this learning path

Start course
1h 16m

This course explores the fundamentals of web applications, JavaServer Faces, and then walks you through a variety of projects that will give you a practical demonstration of how to create a web application and how to use various components of JavaServer Faces.

Learning Objectives

  • Understand the fundamentals of web applications
  • Learn about JavaServer Faces, and how they can be used in your applications

Intended Audience

This course is intended for anyone who already has basic knowledge of Java and now wants to learn about Java EE.


Basic knowledge of Java programming.


Hello dear friends. In this video, we will create our first web application with JSF. Let's begin. First, open Eclipse. In the top right corner, as you can see, we have the Java EE perspective button. If you can't see anything, you can add a perspective with the "Add Perspective" button. Before we begin, I'd like to add a tool to my Eclipse that will provide us with a significant advantage for JSF, JSP, and RESTful operations. Now search JBoss. Now as you can see, this tool is an umbrella project for a set of eclipse plugins that includes support for JBoss and related technologies such as hibernate, Jboss AS/ Wild fly, CDI, OpenShift, Apache Camel, Red hat Jboss fuse. Docker, JSF, html, X Html, maven and more. Install it. 

This will take a little time. Continue installation. We also require the JSF API jar before starting the project because there is no JSF jar in Glassfish 3. However, glass fish 3 requires JSF API 2.0, which we must download. Open any browser and search JSF API 2.1 jar. Now go to the Java website. We will download JSF API 2.1 jar. Done. For easy access, let's move the jar file into our glass fish directory. Done. Now we are ready to create our first project with JSF file. New. Now we will select dynamic web project. Give a project name. As you can see. Glass fish is already selected now we have to modify default configuration. Select JSF. Also let's add JavaScript that we will use in the upcoming Ajax lecture. 

Okay. And next, next again. Now we have to check generate web xml deployment. Otherwise, we have to add this xml to our project manually. Next again. Now, this is the most important part in JSF library area. First look for glass fish and if there is a JSF jar file you can use it, otherwise follow me. First select user library. Look there are two buttons, one to manage and the other to download. You can try and download it but with glass fish three I couldn't download. So we will add it manually, click the manage button. Now click new. We will give a name to our library. I will call it JSF. Now we have a new jar file. Now we will set our jar to this jar. Click add external jars. 

Select JSF jar 2.1 that we have downloaded in the beginning of the video and click open. Done. press Okay. We are now able to use the JSF jar file. Now finish. We have finally created our JSF project. In the java resources folder, navigate to libraries directory. You will see our jar file is listed here. In the SRC folder. We will store our managed beans. In the web content directory, we will hold our design pages. Let's create the first page. Right click new X HTML page. If you like. You can add an X HTML to an HTML file by changing the file extension. Give a name to your file, click next. In this section, we will select the X HTML template. 

Actually, you can use JSP files with JSF if you want, but I'll stick with X HTML files. I will select blank JSF page and next. The last step is finished. There are three tags that we can use in JSF. We'll mostly be using H and F tags. We may also use the Ui tag at times. Now let's write some HTML codes. Now to see this page, we have to adjust web xml file with X HTML files. Look, there are many extension types to choose from when starting a project but there is no X HTML page. We must add something. Otherwise, we won't be able to see the index X HTML page in the browser. Welcome file index X HTML. Done. Start Glass fish server. Run. Look, now we have a web page. Let's take a break here. In the following video, we will examine the managed bean and scope annotations which we will use in JSF operations. See you in the following 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