Primefaces esempio introduttivo

Vai all'indice

L'esempio descritto illustra l'installazione di una web application con Primefaces5 e Maven.
L'obiettivo è l'installazione e l'esecuzione dell'esempio DataTable - Header and Footer presente nello Showcase di Primefaces.
Diversamente dagli esempi descritti precedentemente, è necessario avere installato su Eclipse un application server, io utilizzo Apache Tomcat 7.
Come prima cosa apro Eclipse già integrato con il plugin m2e, seleziono New > Maven Project, inserisco il flag "Create a simple project (skip archetype selection)" procedo nella schermata successiva dove inserisco le informazioni di progetto:
groupId: it
artifactId: jsf2
version: 0.0.1-SNAPSHOT
packaging: war (identifico che sto creando una webapp).

A questo punto il progetto è stato creato. Clicco col tasto destro sul progetto e dalla voce "properties" seleziono la scheda "Project facets" che modifico come da figura.

A seguito di questa impostazione è possibile ricevere la segnalazione: "Dynamic Web Module 3.0 requires Java 1.6 or newer", pertanto è necessario selezionare Java 1.7:
Nella scheda Java Compiler selezionare 1.7 su "Compiler compliance level".
Nella scheda Java Build Path - Libraries, cliccare Add, inserire e selezionare la libreria Java 1.7.
A questo punto, apro il file pom.xml ed inserisco le dipendenze:

<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
  <modelVersion>4.0.0</modelVersion>
  <groupId>it</groupId>
  <artifactId>jsf2</artifactId>
  <version>0.0.1-SNAPSHOT</version>
  <packaging>war</packaging>
  <name>JSF Prova</name>
<build>
 <plugins>
   <plugin>
     <groupId>org.apache.maven.plugins</groupId>
     <artifactId>maven-compiler-plugin</artifactId>
     <version>3.1</version>
     <configuration>
        <source>1.7</source>
        <target>1.7</target>
     </configuration>
   </plugin>
 </plugins>
</build>

<repositories>
  <repository>
     <id>prime-repo</id>
     <name>PrimeFaces Maven Repository</name>
     <url>http://repository.primefaces.org</url>
     <layout>default</layout>
  </repository>
</repositories>

<dependencies>
  <dependency>
     <groupId>com.sun.faces</groupId>
     <artifactId>jsf-api</artifactId>
     <version>2.2.4</version>
  </dependency>
  <dependency>
     <groupId>com.sun.faces</groupId>
     <artifactId>jsf-impl</artifactId>
     <version>2.2.4</version>
  </dependency>
  <dependency>
     <groupId>javax.servlet</groupId>
     <artifactId>javax.servlet-api</artifactId>
     <version>3.0.1</version>
  </dependency>
  <dependency>
     <groupId>javax.servlet</groupId>
     <artifactId>jstl</artifactId>
     <version>1.2</version>
  </dependency>
  <dependency>
     <groupId>org.primefaces</groupId>
     <artifactId>primefaces</artifactId>
     <version>5.0</version>
  </dependency>
     <dependency>
     <groupId>org.primefaces.themes</groupId>
     <artifactId>bootstrap</artifactId>
     <version>1.0.9</version>
  </dependency>
  <dependency>
     <groupId>commons-fileupload</groupId>
     <artifactId>commons-fileupload</artifactId>
     <version>1.3</version>
  </dependency>
</dependencies>
</project>

Nella cartella src/main/webapp/WEB-INF inserisco il web.xml, file che dà le direttive della web application.

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://java.sun.com/xml/ns/javaee" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd" version="3.0">
  <display-name>jsf2</display-name>

  <context-param>
     <param-name>javax.faces.DEFAULT_SUFFIX</param-name>
     <param-value>.xhtml</param-value>
  </context-param>
  <context-param>
     <param-name>javax.faces.PROJECT_STAGE</param-name>
     <param-value>Development</param-value>
  </context-param>
  <context-param>
     <param-name>primefaces.THEME</param-name>
     <param-value>bootstrap</param-value>
  </context-param>

  <welcome-file-list>
     <welcome-file>index.jsf</welcome-file>
  </welcome-file-list>

  <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>*.jsf</url-pattern>
  </servlet-mapping>

  <session-config>
     <session-timeout>30</session-timeout>
  </session-config>
</web-app>

Il faces-config.xml contiene la configurazione per il JSF e va inserito nella cartella webapp/WEB-INF.

 <?xml version="1.0" encoding="UTF-8"?>

<faces-config
    xmlns="http://xmlns.jcp.org/xml/ns/javaee"
    xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
    xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-facesconfig_2_2.xsd"
    version="2.2">

</faces-config>

A questo punto clicco col tasto destro sul progetto e seleziono "Run as" > "Maven clean" e successivamente "Maven install". Aggiorno con Maven > Update Project...

Il passo successivo consiste nel copiare i moduli proposti dallo showcase di Primefaces, io ho optato per DataTable - Header and Footer , ma gli esempi sono veramente tanti!
Il progetto consiste di 4 file:
Car.java: definizione della classe Car
CarService.java: è il servizio che definisce le proprietà dell'oggetto Car.
BasicView.java: il backing bean per la gestione dell'interfaccia utente.
index.xhtml: la pagina jsf che espone il risultato dell'elaborazione nel client.
Di seguito riporto l'alberatura del progetto.

Caricati tutti i moduli è possibile eseguire il progetto cliccando con il tasto destro sull'icona del progetto, quindi seleziono Run as.. > Run on Server. Il risultato è il seguente.

Hai apprezzato questo post? Conferma le mie competenze o scrivi una segnalazione sul mio profilo Linkedin!