Visualizzazione di informazioni dinamiche nelle pagine Web con JavaServer Faces

Questa esercitazione insegna a progettare un sito Web dinamico che funziona come una sezione di annunci pubblicitari di un giornale. Il sito Web è un'applicazione Web J2EE completa che utilizza componenti JSF (JavaServer Faces) e SDO (Service Data Objects). Questa applicazione utilizza la tecnologia JSF per creare pagine Web dinamiche che si collegano a un database in cui sono memorizzati i dati degli annunci pubblicitari. Trascinando i componenti JSF nelle pagine, è possibile creare un'applicazione Web JSF nota come applicazione CRUD in grado di creare, leggere aggiornare ed eliminare i record da un database. Gli utenti del sito possono utilizzare tali funzioni per gestire gli annunci pubblicitari nel database.

Una volta completata questa esercitazione, gli utenti del sito potranno non solo visualizzare gli articoli in vendita, ma anche aggiungere nuovi articoli, modificare i dettagli degli articoli (ad esempio il prezzo o la descrizione) o ricercare un articolo specifico. Nonostante questo sito di esercitazione sia progettato in modo semplice, i concetti e le tecnologie esaminati vengono utilizzati anche in siti Web più grandi e complessi.

Obiettivi di apprendimento

Questa esercitazione è divisa in due moduli, ciascuno con i propri obiettivi di apprendimento. È possibile scegliere di completare uno o entrambi i moduli. In ogni modulo, sarà necessario completare gli esercizi affinché il sito Web funzioni correttamente.

Modulo 1: Creazione di pagine Web con connessioni ai database

Questo modulo insegna come configurare una connessione ad un database e visualizzare le informazioni contenute nel database nella pagina Web. In questo modulo verranno effettuate le seguenti operazioni:

Connettere le pagine Web a un database.
Creare pagine che visualizzano, creano, modificano ed eliminano record dal database.
Inviare i dati da una pagina all'altra

Modulo 2: Aggiunta di funzioni avanzate

Questo modulo illustra come utilizzare in modo efficace i dati provenienti da un database. In questo modulo verranno effettuate le seguenti operazioni:

Formattare record di database in una pagina Web
Aggiungere un componente che consenta di caricare i file in un database da una pagina Web
Navigare da una pagina all'altra automaticamente
Automatizzare alcune attività di amministrazione del database

Quando si è pronti, iniziare il Modulo 1: Creazione di pagine Web con connessioni ai dati.

Tempo necessario

Totale: 3 ore e 30 minuti

Modulo 1: 2 ore

Modulo 2: 1 ora e 30 minuti

Livello di competenza

Intermedio

Destinatari

Sviluppatori di applicazioni Web, progettisti di interfacce utente Web

Requisiti di sistema

Per completare questa esercitazione, è necessario prima installare e configurare un server di runtime. Questa esercitazione è stata testata con i seguenti server:

IBM WebSphere Application Server versioni 6.0, 6.1 e 7.0

Per completare questa esercitazione, è necessario installare gli strumenti SDO. Per installare gli strumenti SDO, in Installation Manager, fare clic su Modifica. Nell'elenco Funzioni, fare clic su IBM Rational Application Developer for WebSphere Software 7.5.0 > Strumenti di sviluppo Web. Selezionare SDO - Mediatori Domino e JDBC, quindi fare clic su Modifica.

Prerequisiti

Per completare questa esercitazione, è necessario avere dimestichezza con i seguenti concetti:

Concetti di progettazione Web di base, quali siti Web, pagine Web, browser e server.
Creazione di una pagina Web statica semplice.
Elementi di una pagina Web, quali tabelle, collegamenti ipertestuali, moduli e immagini.
Termini di database, quali tabelle, record, colonne e campi.

È inoltre utile conoscere i seguenti argomenti:

Come utilizzare le prospettive e le viste del workbench.
Come modificare il codice HTML per una pagina Web.

Risultati previsti

Una volta completata l'applicazione Web, la home page sarà simile all'immagine in basso. La navigazione del sito Web aggiunta alle pagine Web mediante il modello di sito, collega alle pagine che consentono di creare un nuovo annuncio o di visualizzare tutti gli annunci pubblicitari. L'azione riga nella tabella in basso consente all'utente di visualizzare una pagina di aggiornamento in cui è possibile modificare le informazioni associate ad un particolare annuncio.