This article is written by Sudheer Jonna and Ramkumar Pillai, the authors of PrimeFaces Blueprints. This article will give you an introduction to setting up PrimeFaces using Maven or Ant.
The specific topics that will be covered in this article are as follows:
(For more resources related to this topic, see here.)
JavaServer Faces (JSF) is a component-based MVC framework used for building rich User Interface (UI) Java web applications. JSF is a powerful framework with a six-phase lifecycle, and it will automate the common web application tasks such as decoding the user input, processing the input validations and conversions, and rendering or updating the output in the form of generated HTML. Page authors can easily build a customized UI by just dragging-and-dropping the reusable components on the page that provide a rich look and feel to modern UI applications. JSF has built-in support for input conversions and validations, and Ajax support for the components.
Going by the growing popularity of JSF technology, many open source and proprietary UI component frameworks were created to have user interfaces with a fancier look and feel. These component suites were created by introducing their own new components and extending the standard JSF components with additional features. Among all these component suites, PrimeFaces is the best and most popular component suite considering its features, quick releases with more new components and bug fixes, ease of development, extensive documentation, and support from its community.
PrimeFaces is a leading, lightweight, open source user interface component library for JSF-based web applications. In the JSF world, it is miles ahead of the other existing component sets because of the many features it has at its disposal:
It is so well designed that it is important to consider its importance when developing web applications. Page authors and application developers can easily develop web pages by simply dragging-and-dropping the components of the webpage and then adding the required features in a step-by-step fashion: customizing the CSS style classes, extending the component widgets, and rendering according to the custom requirements.
PrimeFaces is a lightweight single library with minimal external libraries. The only external libraries required are those with component-specific features. Apart from these component-specific features, projects only require JSF runtime implementations such as Oracle Mojarra or Apache MyFaces.
The setup and configuration for Maven and non-Maven users is explained in the following two sections.
In this section, we will define the various Maven configuration steps required to run a PrimeFaces-based application. Perform the following steps:
Configure the PrimeFaces library dependency or Maven coordinates in your project pom.xml file as shown here:
<dependency> <groupId>org.primefaces</groupId> <artifactId>primefaces</artifactId> <version>5.0</version> </dependency>
Add the PrimeFaces repository to the repositories list of your project pom.xml file as follows:
<repository> <id>prime-repo</id> <name>Prime Repo</name> <url>http://repository.primefaces.org</url> </repository>
Note that this step is not required for releases after PrimeFaces 4.0. The team started adding its library in the Maven central repository.
Configure either of the JSF runtime implementations, Oracle Mojarra or Apache MyFaces. Choose either of the following two blocks of code:
<dependency> <groupId>com.sun.faces</groupId> <artifactId>jsf-impl</artifactId> <version>2.2.6</version>6 </dependency>
<dependency> <groupId>org.apache.myfaces.core</groupId> <artifactId>myfaces-impl</artifactId> <version>2.2</version> </dependency>
Depending on the component-specific features, you can use the following mandatory and optional dependencies. Here is a list of dependencies categorized into mandatory and optional. The following are the mandatory dependencies:
Dependencies | Version | Description |
JSF runtime | 2.0, 2.1, and 2.2 | Oracle’s Mojarra or Apache MyFaces implementation |
PrimeFaces | 5.0 | The PrimeFaces UI component library |
The following are the optional dependencies:
Dependencies | Version | Description |
iText | 2.7 | To use the DataExporter component for PDF format |
POI | 3.7 | To use the DataExporter component for Excel format |
Rome | 1.0 | To use the Feed reader component |
commons-fileupload | 1.3 | To use the fileupload component (when web server / application server doesn’t support servlet 3.0) |
commons-io | 2.2 | To use the fileupload component |
In this section, we will define the various non-Maven (or Ant) configurations required to run a PrimeFaces-based application. Perform the following steps:
As you know, PrimeFaces is a JSF-based component suite. Therefore, the first thing you have to do is configure the JSF Faces Servlet in your project deployment descriptor file (web.xml). The following is a mandatory configuration for any JSF-based application:
<servlet> <servlet-name>Faces Servlet</servlet-name> <servlet-class>javax.faces.webapp.FacesServlet</servlet-class> <load-on-startup>1</load-on-startup> </servlet> <servlet-mapping> <servlet-name>Faces Servlet</servlet-name> <url-pattern>/faces/*</url-pattern> </servlet-mapping> <servlet-mapping> <servlet-name>Faces Servlet</servlet-name> <url-pattern>*.jsf</url-pattern> </servlet-mapping> <servlet-mapping> <servlet-name>Faces Servlet</servlet-name> <url-pattern>*.faces</url-pattern> </servlet-mapping> <servlet-mapping> <servlet-name>Faces Servlet</servlet-name> <url-pattern>*.xhtml</url-pattern> </servlet-mapping>
It is not mandatory to use all of the JSF extensions or servlet mappings. Any of the preceding servlet mappings is enough to configure Faces Servlet to your project.
There are other configurations that can be made to your project. These are shown in the following table:
Context parameter name | Default value | Description |
THEME | Aristo | Used to apply a specific theme to your application. All theme names are valid values. |
SUBMIT | Full | Enables the Ajax submit mode. The valid values are full and partial. |
DIR | Ltr | Defines the component content orientation. The valid values are ltr and rtl. |
RESET_VALUES | False | When this is enabled, any Ajax-updated inputs are reset first. The valid values are true and false. |
SECRET | PrimeFaces | Defines the secret key to encrypt-decrypt the value of the expressions that are exposed in rendering StreamedContents. |
CLIENT_SIDE_ VALIDATION | False | Controls client-side validations to the form components. |
UPLOADER | Auto | Defines the fileuploader mode. The valid values are auto, native, and commons. |
As an example, the following code snippet configures a theme with context-param:
<context-param> <param-name>primefaces.THEME</param-name> <param-value>delta</param-value> </context-param>
PrimeFaces 5.0 supports all the JSF runtime versions: 2.0, 2.1, and 2.2 at the same time using feature detection without having to compile a dependency to any specific version. In other words, some of the features that are available are based on the runtime version used. The newly released JSF 2.2 version supports more popular HTML5.
The runtime detection policy for PrimeFaces is quite useful for the newly added features in JSF library. The JSF 2.2 passthrough attribute’s feature is a good example of the runtime detection policy. That is, the passthrough attribute only gets rendered if the runtime is JSF 2.2.
An introduction to the autofocus and pattern HTML5 attributes’ integration with PrimeFaces can be seen in the following example:
<!DOCTYPE html> <html > <h:head> </h:head> <h:body> <h:form> <p:inputText value="#{bean.value}" pt_autofocus="autofocus" pt_pattern= "[A-Za-z]"/> </h:form> </h:body> </html>
In this article, you have been introduced to the PrimeFaces component suite, its features, and its role in developing custom applications. You have also learned about the setup and configuration for the PrimeFaces library.
Further resources on this subject:
I remember deciding to pursue my first IT certification, the CompTIA A+. I had signed…
Key takeaways The transformer architecture has proved to be revolutionary in outperforming the classical RNN…
Once we learn how to deploy an Ubuntu server, how to manage users, and how…
Key-takeaways: Clean code isn’t just a nice thing to have or a luxury in software projects; it's a necessity. If we…
While developing a web application, or setting dynamic pages and meta tags we need to deal with…
Software architecture is one of the most discussed topics in the software industry today, and…