Book Image

Primefaces Theme development

Book Image

Primefaces Theme development

Overview of this book

Developing stunning themes for web applications has never been easier! PrimeFaces delivers a powerful set of features that enables JSF developers to create and customize awesome themes on the web. It is very easy to use because it comes as a single JAR file and requires no mandatory XML configuration. With more than 30 out-of-the-box themes, jQuery integration, a mobile UI toolkit, Ajax Push technology, and much more, PrimeFaces takes JSF application development to a whole new level! This book is a hands-on example-rich guide to creating and customizing PrimeFaces themes using available tools. Beginning with creating a JSF project and integrating the PrimeFaces library, this book will introduce you to the features of theme components, how these are structured, and how PrimeFaces uses JQuery UI to apply a theme to your application. You will learn to examine and change the CSS rules and get creative by setting standard icons and adding new icons to them. You will use a combination of JavaScript and CSS to enhance your application with help of scheduler component and go on to adapt and package your custom theme so that it is compatible with the Resource Manager. Finally, you will explore PrimeFaces mobile apps, ensuring themes are compatible with your mobile applications best practices for theme design.
Table of Contents (18 chapters)
PrimeFaces Theme Development
Credits
About the Authors
About the Reviewers
www.PacktPub.com
Preface
Index

Adding the PrimeFaces library and related dependencies to our project


We will use Maven to add all the required resources that we don't create ourselves, and this section will help us to understand how we add libraries to our project. PrimeFaces only requires that the PrimeFaces JAR file be added to our project. So, this is what we do:

  1. By clicking on the + symbol to the left of the project in the Project view, we open the project tree, as follows:

    The following is a brief explanation of the folders, as listed in the previous screenshot:

    • Web Pages: This is where we will add views or pages to our application.

    • Source Packages: Here, Java source code is managed.

    • Other Sources: This allows us to add other types of files which may be needed for the project. We will use this facility. So, its purpose should become clear, eventually.

    • Dependencies: Here we tell Maven the JAR files that we want to add to our project.

    • Runtime Dependencies and Java Dependencies: These are not important for this project. Feel free to browse them at your leisure.

    • Project Files: This is where NetBeans manages both the Maven project's pom.xml file and the NetBeans project configuration file. While we don't need to look at these now, we will visit the pom.xml file in the later chapters. So, if you want to preview these files, please feel free to do so.

  2. Meanwhile, we are going to add PrimeFaces 5.2 to our project. Right-click on the Dependencies folder and select Add Dependency... from the context menu. This opens the Add Dependency dialog box, as shown in the following screenshot:

    Usually, you only have the Search tab available in a newly created project.

    Tip

    Maven allows us to add local projects as dependencies to a project, which is what the Open Projects tab is for. It also allows us to add dependencies that are defined in a parent Maven project file, and this is what the Dependency Management tab is for.

  3. Type org.primefaces into the Query field of the Search tab, and then go and make a drink or something that takes a little time.

    Tip

    Not only have we earned a break, but we also need time to allow Maven to download and install the Maven Central Repository index in our local Maven repository. This takes time because there are a very large number of resources available there. If you already use Maven for your projects, you obviously won't need a lot of time. The break might be welcome, though.

    Once the Maven Central Repository index is available, you will see something like this:

  4. Select the 5.2 version and click on Add. Maven then adds the dependency to our project.