欢迎来到 JSF Primefaces 教程。JavaServer Faces是当今用于实现 Java Web 应用程序用户界面的领先框架之一。 JSF 已经组件化了 Web 应用程序，特别是与界面相关的部分，因为 JSF 中的所有单一视图都是使用服务器端组件树构建的，在呈现到浏览器中时解码为 HTML。
The process of rendering the view in JSF does pass through what known as JSF lifecycle. This tutorial isn’t intended for providing you a detailed discussion of how lifecycle works or how could we deal with. It’s just a notification about what you should know about the JSF framework and how get JSF view ready for rendering. 
JSF has two major implementations till the time in which the article written, oracle implementation Mojarra and Apache MyFaces implementation. Several JSF libraries has been coming into existence, Richfaces, IceFaces, Primefaces, MyFaces, etc and one of the most lead library that used intensively and has an excellent reputation is Primefaces. Primefaces cellabrate before months ago by releasing the Primefaces 5 which will consider the subject of this tutorial and next coming tutorials. For being able of using the primefaces 5, you must install and configure it into your project. Either you are going to use a simple text editor or an enterprise development environment, by ending of this tutorial you will be ready for discovering the all Primefaces components.
众所周知，JavaServer Faces 是一个用于开发丰富的用户界面网页的框架。 JSF 已在多个 Java 社区请求 JSR 中引入，其中最终版本JSF 2于 2009 年 7 月发布，其中包含一组增强功能和新功能。 JSF 2 产生了一系列后果，最后一个是JSF 2.2于 2013 年 5 月发布。与 JSF 1.x 不同，JSF 2.x 提供了许多功能，例如使用注释来声明 JSF 托管 bean、转换器、验证器、作用域等。这不是故事的全部，JSF 2提供了新的范围，如查看范围、自定义范围、流程范围和对话范围等等。另外，我们不能忘记为 JSF 2 添加的最令人惊奇的功能，它是 Ajax 概念。在 JSF 2 中，Ajax 本质上内置于 JSF 框架中。因此，任何 JSF 组件都可以通过简单地添加 Ajax 内容来实现 ajaxified。导航规则也发生了变化并且变得更加容易。接下来的教程将详细介绍为 JSF 2 添加的功能，而在本教程中，您将创建简单的 JSF 应用程序以及如何使用 Primefaces 标签来实现某些业务场景的基本示例。
为了开始发现本教程，您必须使用以下开发工具。
It’s obvious that we’ve used the Tomcat 7 for deploying the application and Eclipse IDE for developing the required components where the Maven used as building tool and for managing dependencies. So, be sure that you are aware of how could be all of these softwares installed and configured into your development machine. Our final project will look like below image. 
Eclipse IDE支持开发Web项目动态项目伞。要创建动态项目，只需按照以下步骤操作：
正如我们之前提到的，我们的目标是使用 JSF/Primefaces 来开发使用 primefaces 用户界面组件的 Web 应用程序，但目前，我们拥有的只是一个简单的动态应用程序，需要更多步骤来配置 jsf。要将 jsf 添加到您的项目中，您需要添加jsf 方面请注意，添加 jsf 实现确实可以帮助您构建使用 Mojarra 的 jsf 应用程序。要添加该方面，您需要执行以下步骤：
After installing the JSF library, the JSF capabilities window looks like 
By end of this phase, you have a web application with jsf capabilities.
目前，您的应用程序已准备好使用 JavaServer Faces 用户界面，但尚未使用 Primefaces。为了能够使用 primefaces，您必须遵循以下步骤：
现在，您的项目已准备好开发 JSF/Primefaces 应用程序，如您所见。我们将创建一个简单的应用程序，其中包含 Primefaces数据表已消耗了支持 bean 中的员工列表。员工列表将由@PostConstruct特殊方法。请按照以下步骤开发完整的 JSF/Primefaces 应用程序。
package com.journaldev.data;
public class Employee {
private String employeeId;
private String employeeName;
public String getEmployeeId() {
return employeeId;
}
public void setEmployeeId(String employeeId) {
this.employeeId = employeeId;
}
public String getEmployeeName() {
return employeeName;
}
public void setEmployeeName(String employeeName) {
this.employeeName = employeeName;
}
}
package com.journaldev.jsfBeans;
import java.util.ArrayList;
import java.util.List;
import javax.annotation.PostConstruct;
import javax.faces.bean.ManagedBean;
import javax.faces.bean.SessionScoped;
import com.journaldev.data.Employee;
@ManagedBean
@SessionScoped
public class ViewEmployeesManagedBean {
private List<Employee> employees = new ArrayList<Employee>();
public ViewEmployeesManagedBean(){
}
@PostConstruct
public void populateEmployeeList(){
for(int i = 1 ; i <= 10 ; i++){
Employee emp = new Employee();
emp.setEmployeeId(String.valueOf(i));
emp.setEmployeeName("Employee#"+i);
this.employees.add(emp);
}
}
public List<Employee> getEmployees() {
return employees;
}
public void setEmployees(List<Employee> employees) {
this.employees = employees;
}
}
请注意 JSF 注释的使用以及 PostConstruct 注释的使用来填充员工列表。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "https://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="https://www.w3.org/1999/xhtml"
xmlns:ui="https://java.sun.com/jsf/facelets"
xmlns:h="https://java.sun.com/jsf/html"
xmlns:f="https://java.sun.com/jsf/core"
xmlns:p="https://primefaces.org/ui">
<p:outputLabel value="JournalDev - JSF2/Primefaces Tutorial"></p:outputLabel>
<p:dataTable value="#{viewEmployeesManagedBean.employees}" var="employee">
<p:column>
<f:facet name="header">
<h:outputText value="Employee ID"></h:outputText>
</f:facet>
<h:outputText value="#{employee.employeeId}"></h:outputText>
</p:column>
<p:column>
<f:facet name="header">
<h:outputText value="Employee Name"></h:outputText>
</f:facet>
<h:outputText value="#{employee.employeeName}"></h:outputText>
</p:column>
</p:dataTable>
</html>
注意使用dataTable元素从托管 bean 属性创建表。 PrimeFaces 和 JSF 负责将这些传递到视图页面进行渲染。如果您有 Servlet 背景，您可以很容易地看到步骤数量减少了 - 在 Servlet 环境中，我们首先在 Servlet 中处理请求，创建模型数据，将其设置为 request/session 中的属性，然后将其转发到用于呈现响应的 JSP 页面。
<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="https://www.w3.org/2001/XMLSchema-instance"
xmlns="https://java.sun.com/xml/ns/javaee"
xsi:schemaLocation="https://java.sun.com/xml/ns/javaee https://java.sun.com/xml/ns/javaee/web-app_3_0.xsd"
id="WebApp_ID" version="3.0">
<display-name>JournalDev-PrimefacesWebApplication</display-name>
<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>
<context-param>
<description>State saving method: 'client' or 'server' (=default). See JSF Specification 2.5.2</description>
<param-name>javax.faces.STATE_SAVING_METHOD</param-name>
<param-value>client</param-value>
</context-param>
<context-param>
<param-name>javax.servlet.jsp.jstl.fmt.localizationContext</param-name>
<param-value>resources.application</param-value>
</context-param>
<listener>
<listener-class>com.sun.faces.config.ConfigureListener</listener-class>
</listener>
</web-app>
请注意javax.faces.webapp.FacesServlet是控制器类，这是我们将 JSF 插入 Web 应用程序的地方。
<?xml version="1.0" encoding="UTF-8"?>
<faces-config
xmlns="https://xmlns.jcp.org/xml/ns/javaee"
xmlns:xsi="https://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="https://xmlns.jcp.org/xml/ns/javaee https://xmlns.jcp.org/xml/ns/javaee/web-facesconfig_2_2.xsd"
version="2.2">
</faces-config>
This is where we provide JSF components configurations such as managed beans, i18n global messages, custom view handlers and custom factory classes. Since we are using annotations and it’s a simple project, there is no configuration done here, but we will see it’s usage in future posts. Now when you will run this, you will get output as shown in below image. 
Maven 是管理 java 项目构建和依赖项的首选方式，因此在这里我们将了解如何将其转换为 Maven。 Eclipse IDE 提供了将您的动态网页项目进入马文。 Maven 将帮助您控制和管理所需的依赖项。只需右键单击创建的项目，然后从配置菜单中选择转换成Maven项目。将项目更改为 Maven 后，您必须添加所需的依赖项，以使项目可由 Maven 本身进行编译。将应用程序转换为 Maven 项目并添加 JSF 2、Primefaces 等所需的库后，您获得的假设 Maven XML 是：
<project xmlns="https://maven.apache.org/POM/4.0.0" xmlns:xsi="https://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="https://maven.apache.org/POM/4.0.0 https://maven.apache.org/xsd/maven-4.0.0.xsd">
<modelVersion>4.0.0</modelVersion>
<groupId>JournalDev-PrimefacesWebApplication</groupId>
<artifactId>JournalDev-PrimefacesWebApplication</artifactId>
<version>0.0.1-SNAPSHOT</version>
<packaging>war</packaging>
<build>
<sourceDirectory>src</sourceDirectory>
<plugins>
<plugin>
<artifactId>maven-compiler-plugin</artifactId>
<version>3.1</version>
<configuration>
<source>1.6</source>
<target>1.6</target>
</configuration>
</plugin>
<plugin>
<artifactId>maven-war-plugin</artifactId>
<version>2.3</version>
<configuration>
<warSourceDirectory>webapp</warSourceDirectory>
<failOnMissingWebXml>false</failOnMissingWebXml>
</configuration>
</plugin>
</plugins>
<finalName>${project.artifactId}</finalName>
</build>
<repositories>
<repository>
<id>prime-repo</id>
<name>PrimeFaces Maven Repository</name>
<url>https://repository.primefaces.org</url>
<layout>default</layout>
</repository>
</repositories>
<dependencies>
<!-- Servlet -->
<dependency>
<groupId>javax.servlet</groupId>
<artifactId>servlet-api</artifactId>
<version>2.5</version>
<scope>provided</scope>
</dependency>
<!-- Faces Implementation -->
<dependency>
<groupId>com.sun.faces</groupId>
<artifactId>jsf-impl</artifactId>
<version>2.2.4</version>
</dependency>
<!-- Faces Library -->
<dependency>
<groupId>com.sun.faces</groupId>
<artifactId>jsf-api</artifactId>
<version>2.2.4</version>
</dependency>
<!-- Primefaces Version 5 -->
<dependency>
<groupId>org.primefaces</groupId>
<artifactId>primefaces</artifactId>
<version>5.0</version>
</dependency>
<!-- JSP Library -->
<dependency>
<groupId>javax.servlet.jsp</groupId>
<artifactId>javax.servlet.jsp-api</artifactId>
<version>2.3.1</version>
</dependency>
<!-- JSTL Library -->
<dependency>
<groupId>javax.servlet</groupId>
<artifactId>jstl</artifactId>
<version>1.1.2</version>
</dependency>
</dependencies>
</project>
并通过执行mvn清理包针对该项目，您将获得一个 WAR 文件，准备好针对任何 Java EE 容器进行部署。只需部署并检查即可。
本教程介绍了如何使用 JSF 2 / Primefaces 来实现 Web 应用程序用户界面。为此，我们使用 Eclipse IDE 来实现这一目标，方法是创建一个动态项目，然后添加所有必需的库，无论是 JSF 2 实现所必需的库还是使用 Primefaces 组件所需的库。从下一个教程开始，我们将使用 Maven 为我们的示例创建项目。
下载 PrimeFaces Hello World 项目
从上面的链接下载示例项目并尝试它以了解更多信息。参考：Primefaces 官方网站