PrimeFaces Tutorial Series

PrimeFaces with JSF2 and Eclipse

Interested in live training from the author of these tutorials? See the upcoming JSF 2.2 and PrimeFaces training courses in Maryland, co-sponsored by Johns Hopkins. Or, contact hall@coreservlets.com for info on customized JSF 2 or PrimeFaces courses onsite at your location. See the JSF and PrimeFaces training page for various options for the onsite courses.


Following is a series of introductory tutorials on PrimeFaces, a popular third-party component library for JSF 2. This is intended as a beginner's tutorial, aimed at developers who already know JSF 2, but who are new to PrimeFaces. It shows the most common usage of the most popular elements, but does not discuss every option or cover nearly all of the myriad PrimeFaces components. So, it is intended as a fast start for newcomers to PrimeFaces, and does not replace the PrimeFaces showcase and User's Guide for experienced PrimeFaces developers. Since each section includes exercises and exercise solutions, this can also be viewed as a self-paced introductory PrimeFaces training course. All the slides, source code, exercises, and exercise solutions are free for unrestricted use. Click on a section below to expand its content. The relatively few parts on IDE development and deployment use Eclipse, but of course none of the actual code is Eclipse-specific. These tutorials assume that you already know Java and at least the basics of JSF 2. If you don't already know JSF version 2, see the JSF 2 tutorial series. If you don't already know the Java language, please see the Java programming tutorial series. If you already have JSF or PrimeFaces experience, see the JSF and PrimeFaces jobs page.

Overview of the PrimeFaces Tutorial Series

For most types of applications, JSF 2 is now the recommended way to build Java-based Web applications, and it is dramatically better than JSF 1 in almost every way, and is both more powerful and easier to use. However, JSF 2 does not include rich GUI elements; JSF leaves this task to the third-party component libraries. PrimeFaces is at least as powerful as the competing component libraries, and is significant simpler to get started with than most of them. Depending how you measure it, PrimeFaces is also the most popular choice, significantly more widely used than RichFaces, IceFaces, and Oracle ADF Faces. Click on a topic below to get the detailed tutorial for that topic, download the section's source code as an Eclipse project, see exercises, get the source code for the exercise solutions, or to simply run the sample apps from that section. Practicing is the key to learning, so I strongly recommend that you try out a few of the exercises in each section before you peek at the solutions.

PrimeFaces is big, and there is no hope of covering all of it in this tutorial series. The goal here is to cover the most important and most widely used features of the most important components. In particular, for each topic, the idea is to explain the most important parts that can be covered in a 30-60 minute lecture. Each section is followed by a set of exercises that can be done in 30-60 minutes if you understand the lecture clearly.

These tutorials are derived from Marty Hall's world-renowned live JSF 2 and PrimeFaces training courses. Customized courses on JSF and PrimeFaces (or JSF2 or PrimeFaces separately) are usually taught on-site at customer locations, but Ajax, jQuery, GWT, JSF 2.2, PrimeFaces, Spring, Hibernate, RESTful Web Services, Android, Hadoop, and Java 8 training courses at public venues are periodically scheduled for people with too few developers for an onsite course. For descriptions of the various other courses that are available, please see the Java EE and Ajax training course page. To inquire about a customized training course at your location, please contact Marty at hall@coreservlets.com.

If you find these free tutorials helpful, we would appreciate it if you would link to us. Send corrections or feedback on any tutorial to hall@coreservlets.com.

A Whirlwind Review of JSF 2.2 Programming

This section gives brief examples of the the most important JSF concepts that are expected as prerequisites for the PrimeFaces sections. This is a good way to get a quick review of the main JSF development techniques. However, the examples are relatively brief, and there is minimal explanation. If these topics are completely new to you, you might want to start with the JSF 2.2 tutorial series first.

  • Topics covered:
    • Setting up your IDE and project for JSF 2.2
    • Testing tags
    • Navigating from page to page
    • Representing form data
    • Applying business logic
    • Using page templates and include files
    • Validating input data
    • Ajaxifying pages to avoid page reloads
    • Using PrimeFaces to make things prettier (quick preview)
  • Tutorial section in PDF (best for printing and saving).
  • Tutorial section on SlideShare (preferred by some for online viewing).
  • Source code of examples in this section, bundled as an Eclipse project. If you deploy to Tomcat or another servlet/JSP engine supporting servlets 2.5 or later, use the project exactly as is. If you deploy to Glassfish, JBoss, WebSphere, WebLogic, Resin, or another Java EE server, delete the unneeded JAR file from WEB-INF/lib. Java EE 6 servers support JSF 2.0; Java EE 7 servers support JSF 2.2.
  • Exercises to reinforce the concepts in this section. I strongly recommend that you try out at least a few of the exercises before moving on to later sections. If you can do the exercises in 30-90 minutes, you are ready to move on to the upcoming PrimeFaces sections. If the exercises are too difficult, then review the topics in the the JSF 2 tutorial series first.
  • Source code for exercise solutions. A downloadable Eclipse project containing the solutions to the exercises above. But try the exercises yourself before peeking!
  • Live-running apps. Downloading the source code (above) and using it for your own apps is probably what most developers want to do. But if you just want to see the apps in action, try the following links. Non-Eclipse users can also grab the .war file (with .java source included) from the parent folder.

PrimeFaces: Overview, Installation, and Setup

This section gives an overview of PrimeFaces, compares it to other third-party JSF component libraries, surveys its capabilities, and shows you how to configure your JSF application to use it. Note: this section assumes that you already know how to create and deploy a JSF2 Dynamic Web Project in Eclipse as described in the Getting Started section of the JSF 2 tutorial series.

PrimeFaces: Date Input

This section covers p:calendar, the PrimeFaces input element for collecting dates and times. It also introduces the style of programming with PrimeFaces in JSF2, and briefly summarizes the PrimeFaces versions of some of the standard JSF elements: p:commandButton, p:message, p:messages, p:fieldset, and p:ajax. Note: this and all following sections assume that you already know how to create and deploy a JSF2 Dynamic Web Project in Eclipse as described in the Getting Started section of the JSF 2 tutorial series.

PrimeFaces: Number Input

This section covers p:spinner, p:slider, and p:rating, the three main PrimeFaces input element for collecting numbers. It also assumes that you are familiar with the basic style of programming in PrimeFaces (with p:commandButton, p:messages, etc.), as introduced in the section on Date Input.

PrimeFaces: String Input Part 1 (p:autocomplete & p:inputMask)

The main emphasis of this section is p:autocomplete, a component for gathering strings in a textfield that has suggestions in a dropdown box. This section also covers the much simpler p:inputMask, a textfield that shows template text and only allows certain types of characters in each position.

PrimeFaces: String Input Part 2 (p:colorPicker, p:inplace, p:captcha, p:password, & p:editor)

This section discusses a variety of other PrimeFaces input elements, the most general-purpose of which is p:inplace for making text that turns into something else (usually input elements) when the user clicks on it. Also covers p:colorPicker, p:captcha, p:password (not named p:inputSecret), and p:editor. p:editor should not be used in its default configuration for apps where other users can see the rich text: the presence of the "Show Source" button allows malicious users to insert arbitrary markup, including <script> tags. Even with careful filtering, be wary of letting spammers insert images and links to their sites.

PrimeFaces: Ajax

This section discusses how p:ajax differs from (and is better than) f:ajax from standard JSF. It also looks at the builtin Ajax attributes of p:commandButton, discusses Ajax-based field validation, and looks at p:ajaxStatus, the global Ajax notifier.

PrimeFaces: Dialogs and Other Overlays

This section discusses messages, tooltips, growl messages, dialog boxes, and confirmation dialogs. It also explains the special steps necessary when using dialog boxes alongside automatic validation.

PrimeFaces: Accordions, Tabs, and other Panels

This section discusses how to group content in accordion panels, tabbed panels, scroll panels, panel grids (themed tables), and dashboard panels (panels that can be dragged and reordered).

PrimeFaces: Data Tables

This section looks at data tables in PrimeFaces. It starts by explaining the differences between p:dataTable and the standard JSF h:dataTable, then looks at three of the many extended features: resizable columns, sortable tables, and pagination.

PrimeFaces: Menus

This section looks at menubars and menus, including submenus and the use of icons in menus. Simple but useful!

PrimeFaces: Charts and Graphs

This section looks at pie charts, line charts, area (filled line) charts, and bar charts. It also looks at using Ajax to respond to user selections.

PrimeFaces: Themes (Skins)

This section discusses how to install and use various PrimeFaces themes (skins) and how to change the theme in web.xml, via p:themeSwitcher, and with your custom JavaScript code. It also discusses best practices for making your apps adapt easily to changes in the theme.

More PrimeFaces Components

I plan to add coverage of additional components as time permits. Email me at hall@coreservlets.com if you have strong opinions about which features should be covered next. You can send me comments and corrections on the existing sections as well.

Source Code

Source code for all examples in this tutorial as well as the exercise solutions can be downloaded from the PrimeFaces sample code repository. Code is free for completely unrestricted use. Each section above also has links to the code used in that section. You can also view the running apps online at http://apps.jsf2.com/. That site also includes WAR files for all sections, with .java source included in the WARs. The WAR files might be a good alternative for non-Eclipse users who want the source code, especially if you don't know how to import Eclipse projects into your IDE.

Customized Onsite Training

Looking for short hands-on training courses on Java 8, general Java programming, JSF 2.2, PrimeFaces, Android development, or other Java-related topics taught at your company? The courses are taught by Marty Hall, an experienced instructor, developer, speaker, and well-known Java EE author, and the creator of this tutorial series. For more information, see the JSF and PrimeFaces training course page, the Java training course page or contact Marty to arrange a course at your location. Courses are available in any country, and have been given in N. America, Central America, Europe, Asia, and Australia. Distinctive features of Marty's training:


  • Experienced instructor who can answer tough questions and show best practices.
    Marty Hall and James Gosling @ Marty's car

    Marty & Java inventor James Gosling at Marty's car.

    With the big training vendors, you don't even know the instructor's name before the class begins, much less their credentials. Marty is an experienced real-world developer, award-winning instructor, conference speaker on Java EE topics (including five times at JavaOne and twice as keynote speaker at the Great Indian Developer Summit), and author of six popular J2EE books from Prentice Hall. Core Servlets & JavaServer Pages is the most popular servlet and JSP book internationally, with translations in Bulgarian, Chinese (both traditional and simplified script), Czech, French, German, Hebrew, Japanese, Korean, Macedonian, Polish, Portuguese, Russian and Spanish. Marty is also the co-author (with David Geary and Cay Horstmann) of the upcoming JSF 2.2 edition of Core JSF, the leading JSF text worldwide. Marty also teaches in the Johns Hopkins University part-time graduate program in Computer Science, where he directs the Java and Web-related concentration area. Click here for more details.
  • Well-tested courses. Marty has taught J2EE training courses in Canada, Australia, Japan, Puerto Rico, Mexico, India, Cambodia, Norway, the Philippines, and dozens of US venues. Clients for on-site Java courses include Google, Symantec, Verisign, the NY Stock Exchange (SIAC), the Federal Reserve Bank, State Farm Insurance, General Motors, Hewlett Packard, Motorola, Telenor Norway, Lexmark International, TransCanada Pipelines, Raytheon, Learjet, Sikorsky, the Aerospace Corporation, Informatica India, Los Alamos National Labs, Genomica, the U.S. Navy, General Dynamics, Banco Popular de Puerto Rico, Titan Corporation, the University of Michigan, Context Integration, the University of Utah Hospital, ESI, SAIC, NSA, CIA, and many others. Click here for a longer list. No using your developers as guinea pigs!
  • Flexible schedules. Courses are available in any city worldwide, and have been taught in dozens of US venues and 9 other countries. However, Maryland-area companies have extra flexibility in the course schedules, since Marty is local to Maryland. In addition to the full-day courses offered in all locations, Maryland companies can book the courses in the late afternoons or early evenings. Even weekends are possible! For example, Marty has done about a dozen Maryland courses that met once or twice a week from 4:30-6:30 pm (or similar) so that the students did not lose billable hours.
  • Course materials developed by the instructor. Marty personally developed all of his own materials, much of it based on his best-selling books. They thoroughly cover the basics, introduce advanced topics, include many meaty code examples, and show plenty of live running applications. They also discuss best practices, design strategies, and efficiency issues. Most of the big training vendors hire someone to create the course materials, then bring in some inexperienced flunky to regurgitate them to the class.
  • Public (open-enrollment) training courses
    JHU/EP Logo Onsite courses are cheaper and more convenient for organizations that have medium to large sized groups of developers. But, in order to serve organizations with only one or two developers that need training, coreservlets.com periodically offers public versions of some of the most popular courses. The next public offerings will be on Java programming, new features in Java 8, Android programming, Web application development with JSF2, PrimeFaces, Big-Data Apps with Hadoop, Rich Internet Applications with Ajax (and jQuery), GWT programming, Hadoop, Java EE programming with Spring, Java persistence with Hibernate and JPA, and Web Services (RESTful and SOAP-based). The courses are co-sponsored by Johns Hopkins Engineering for Professionals and are held at JHU/Dorsey in Elkridge Maryland (5 minutes from BWI airport). Click here for details.
  • A variety of complementary course offerings.
    Promos for Marty Hall at GIDS conference in Bangalore

    Ads for Marty at GIDS conference in India

    Marty personally teaches the following courses (click for detailed course descriptions): In addition, Marty reviews/edits courses taught by colleagues. These courses are developed by experts who work daily with the technologies, and the materials are thoroughly reviewed by Marty. Course topics include:
  • Customizable content. Want a class on JSF 2 or Spring or Hadoop, but need some review of basic Java first? No problem. Want to move extra fast because your developers are experienced? Piece of cake. Need to combine some basic JSF topics with thorough coverage of PrimeFaces? Just say the word. Want an Ajax and jQuery course, but first need a crash course on JavaScript syntax, first-class functions, and the DOM? Simply let us know. Want training on GWT, but need a review of basic server-side Java techniques first? Tell us what you need. Every onsite course is fully customized to the needs and backgrounds of your developers.
  • Competitive prices. Marty's public training courses are typically at least 20% cheaper than the canned courses from the big training vendors. And his courses include a textbook, a bound student notebook, meals and snacks, exercises, and exercise solutions. Onsite courses at your location are even cheaper, since there are no venue rental costs. Plus, your developers don't have to pay travel costs and the content and pace is customizable.

Email for details.

PowerPoint Files for University Faculty

The PDF files in this tutorial contain the complete text of the original PowerPoint files, so if your goal is learning this technology, just stick with this tutorial. However, as a service to instructors teaching full-semester courses at accredited universities, coreservlets.com will release the original PowerPoint files for free. Please see the instructor materials page for details.

More Information

Java

JSF (JavaServer Faces)

Servlets & JSP
Ajax, GWT, & JavaScript

Spring, Hibernate, & JPA

Struts