Benvenuti al Tutorial JSF per principianti. La tecnologia Java Server Faces (JSF) è un framework front-end che semplifica la creazione di componenti dell’interfaccia utente riutilizzando i componenti UI. JSF è progettato sulla base del pattern Model View Controller (MVC) che separa la presentazione, il controller e la logica di business.
JSF Tutorial per principianti
Nel pattern Model View Controller, il modello contiene la logica di business necessaria per completare lo scenario aziendale, la vista rappresenta il livello di presentazione come le pagine JSP o JSF e il controller rappresenta il processo di gestione del controllo al modello/vista a seconda dell’operazione richiesta. JSF fornisce i seguenti componenti per creare un’interfaccia utente:
- Elementi di input di base standard come campi, pulsanti ecc. che costituiscono il set di componenti UI di base.
- Capacità di rendering di JSF in base alle specifiche del cliente
- Libreria di base
- Estensione dei componenti UI disponibili per aggiungere più componenti e utilizzarli per soddisfare i requisiti del cliente.
Guida JSF per principianti – Configurazione dell’ambiente
Qui passeremo attraverso tutti i passaggi necessari per configurare il tuo computer per creare la prima applicazione JSF.
Installazione di JDK
Scarica il JDK dal seguente sito web Oracle https://www.oracle.com/technetwork/java/javase/downloads/index.html Imposta la variabile d’ambiente JAVA_HOME che punta al percorso bin del JDK installato. Ad esempio “C:\Program Files\Java\jdk1.7.0_60”. Aggiungi anche JAVA_HOME\bin alla variabile PATH per localizzare i binari di Java. Verifica ora se Java è installato correttamente sul computer digitando javac nella finestra dei comandi, che dovrebbe visualizzare tutte le opzioni disponibili, oppure “java -version”, che dovrebbe mostrare la versione di Java installata sul computer. Per ulteriori dettagli, puoi consultare il seguente post: Come installare Java su Windows
Installazione dell’IDE
Alcuni dei popolari IDE disponibili includono Eclipse, NetBeans e IntelliJ IDEA. Scarica Eclipse dal seguente link https://www.eclipse.org/downloads/ ed esegui il file binario scaricato per installare Eclipse sul tuo computer. Per NetBeans, scarica NetBeans IDE da https://netbeans.org/downloads/ e completa l’installazione.
Installazione di Apache Tomcat
Scarica Tomcat dal seguente link https://tomcat.apache.org/. Esegui il file binario scaricato e imposta la variabile CATALINA_HOME per puntare al percorso di installazione. Ora avvia il server e vai su https://localhost:8080 nel tuo browser preferito che visualizza la pagina predefinita di Tomcat se installato correttamente. La nostra configurazione di base è pronta, passiamo alla creazione della nostra prima applicazione JSF.
JSF Tutorial per Principianti – Applicazione Hello World
Creiamo ora una semplice applicazione web JSF hello world. Scarica i seguenti file jar che sono essenziali per eseguire il codice relativo a JSF. Questi possono essere scaricati dal repository centrale di Maven https://search.maven.org/. Un modo più chiaro di gestire le dipendenze è utilizzare un sistema di build come Maven. Per tutti i nostri esempi, useremo Maven. Si prega di fare riferimento al file pom.xml per le dipendenze. jsf-api-1.2.jar jsf-impl-2.2.8-04.jar pom.xml
<?xml version="1.0" encoding="UTF-8"?>
<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>com.journaldev.jsf</groupId>
<artifactId>JSF_HelloWorld</artifactId>
<version>1.0-SNAPSHOT</version>
<packaging>war</packaging>
<name>JSF_HelloWorld</name>
<properties>
<endorsed.dir>${project.build.directory}/endorsed</endorsed.dir>
<project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>
</properties>
<dependencies>
<dependency>
<groupId>javax</groupId>
<artifactId>javaee-web-api</artifactId>
<version>7.0</version>
<scope>provided</scope>
</dependency>
<dependency>
<groupId>com.sun.faces</groupId>
<artifactId>jsf-api</artifactId>
<version>2.1.13</version>
</dependency>
<dependency>
<groupId>com.sun.faces</groupId>
<artifactId>jsf-impl</artifactId>
<version>2.1.13</version>
</dependency>
</dependencies>
<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>
<compilerArguments>
<endorseddirs>${endorsed.dir}</endorseddirs>
</compilerArguments>
</configuration>
</plugin>
<plugin>
<groupId>org.apache.maven.plugins</groupId>
<artifactId>maven-war-plugin</artifactId>
<version>2.3</version>
<configuration>
<failOnMissingWebXml>false</failOnMissingWebXml>
</configuration>
</plugin>
<plugin>
<groupId>org.apache.maven.plugins</groupId>
<artifactId>maven-dependency-plugin</artifactId>
<version>2.6</version>
<executions>
<execution>
<phase>validate</phase>
<goals>
<goal>copy</goal>
</goals>
<configuration>
<outputDirectory>${endorsed.dir}</outputDirectory>
<silent>true</silent>
<artifactItems>
<artifactItem>
<groupId>javax</groupId>
<artifactId>javaee-endorsed-api</artifactId>
<version>7.0</version>
<type>jar</type>
</artifactItem>
</artifactItems>
</configuration>
</execution>
</executions>
</plugin>
</plugins>
</build>
</project>
JSF Tutorial per Principianti – Creare un Bean Gestito
A managed bean is a java class registered to JSF which makes interaction between the UI and the business logic possible. Create a managed bean named HelloWorld.java using @ManagedBean annotation as
package com.journaldev.jsf.helloworld;
import java.io.Serializable;
import javax.faces.bean.ManagedBean;
import javax.faces.bean.SessionScoped;
@ManagedBean(name="helloWorld")
@SessionScoped
public class HelloWorld implements Serializable{
private static final long serialVersionUID = -6913972022251814607L;
private String s1 = "Hello World!!";
public String getS1() {
System.out.println(s1);
return s1;
}
public void setS1(String s1) {
this.s1 = s1;
}
}
L’annotazione `@ManagedBean` indica che la classe HelloWorld è un bean gestito. Il bean `@SessionScoped` indica che il bean è attivo fino a quando la `HttpSession` è valida. Qui viene dichiarata una stringa `s1` e inizializzata con “Hello World” e vengono definite i metodi getter e setter per recuperare il valore della stringa `s1`. Possiamo anche fornire il nome del bean come `@ManagedBean(name="helloWorld")`. Se non viene fornito alcun nome, viene derivato secondo gli standard di denominazione Java. La prassi migliore è sempre fornire il nome del bean.
JSF Tutorial per Principianti – Visualizza Pagina
Ora crea una pagina JSF chiamata `helloWorld.xhtml` che interagisce con il bean `HelloWorld` e recupera il valore attraverso il metodo getter e stampa lo stesso nella pagina di risposta. `helloWorld.xhtml`
<?xml version='1.0' encoding='UTF-8' ?>
<!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:h="https://java.sun.com/jsf/html">
<h:head>
<title>Hello World JSF Example</title>
</h:head>
<h:body>
#{helloWorld.s1}
<br /><br />
</h:body>
</html>
Qui chiamiamo il nome del bean seguito dalla variabile stringa dichiarata nel bean come “helloWorld.s1” che recupera il valore “Hello World”.
Configurazione del Descrittore di Distribuzione
La parte finale consiste nella configurazione della classe del controller JSF per gestire le richieste del client. Il servlet del controller JSF è FacesServlet, la configurazione finale di web.xml è riportata di seguito. web.xml
<?xml version="1.0" encoding="UTF-8"?>
<web-app version="3.1" 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-app_3_1.xsd">
<context-param>
<param-name>javax.faces.PROJECT_STAGE</param-name>
<param-value>Development</param-value>
</context-param>
<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>
<session-config>
<session-timeout>
30
</session-timeout>
</session-config>
<welcome-file-list>
<welcome-file>faces/helloWorld.xhtml</welcome-file>
</welcome-file-list>
</web-app>
La struttura finale del progetto JSF Hello World apparirà ora come segue in Eclipse. 
Nel web.xml, specifichiamo l’entry del file di configurazione di Faces insieme alla mappatura del servlet per Faces, il timeout della sessione e il file di benvenuto che viene caricato all’avvio dell’applicazione. Una volta completate queste modifiche, eseguiremo l’applicazione che stamperà l’output seguente nel browser. 
Questo conclude il tutorial su JSF per principianti. Esamineremo diversi componenti di pagina JSF nei prossimi post. Nel frattempo, puoi scaricare il progetto dal link sottostante e sperimentare con esso per apprendere di più.
Source:
https://www.digitalocean.com/community/tutorials/jsf-tutorial-for-beginners