Diario delle Lezioni - A.A. 2025/2026

Lezioni totali: 20, ore erogate: 40 (83%) - Prima lezione: 24/02/2026, Ultima lezione: 07/05/2026

Lezione 1: Il web moderno: tecnologie, sfide, problemi

24/02/2026, ore 14:30 (2 ore)

  • (1-1)
    Presentazione del corso
  • (1-2)
    Le origini del Web
  • (1-3)
    L'architettura client-server
  • (1-4)
    Web 2.0: Rich Internet Applications, Social Web
  • (1-5)
    I problemi del web odierno: accessibilità, fruibilità cross-browser, sicurezza, usabilità,...
  • (1-6)
    Le tecnologie per il web: lato client (HTML5, CSS3 e responsive design, Javascript, AJAX)
  • (1-7)
    Le tecnologie per il web: lato server (Java servlets, JDBC, Freemarker templates)
  • (1-8)
    La realizzazione di un'applicazione web secondo il pattern MVC: il modello dei dati, la logica, la presentazione

Lezione 2: XML

26/02/2026, ore 14:30 (2 ore)
Slides XML

  • (2-1)
    Il protocollo HTTP
  • (2-2)
    Concetti di base URI, URL, media types...
  • (2-3)
    Cosa è e cosa non è XML
  • (2-4)
    Sintassi base di un documento XML: la dichiarazione XML
  • (2-5)
    Esempio Problemi con il character encoding
  • (2-6)
    Character encoding: cos'è veramente UTF-8? (e UTF-16? e ISO-8859-1??)
  • (2-7)
    Esempio Character encoding: può essere anche un problema di sicurezza: l'attacco UTF-7
  • (2-8)
    Sintassi base di un documento XML: la dichiarazione DOCTYPE
  • (2-9)
    Esempio Dichiarare correttamente la versione di HTML un uso
  • (2-10)
    Standards e Quirks mode per i browser
  • (2-11)
    Sintassi base XML: Elementi e regole sintattiche
  • (2-12)
    Esempio Problemi comuni legati alla sintassi degli elementi
  • (2-13)
    Sintassi base XML: Attributi e regole sintattiche
  • (2-14)
    Esempio Problemi comuni legati alla sintassi degli attributi
  • (2-15)
    Sintassi base XML: i namespaces
  • (2-16)
    Sintassi base XML: Testo ed entità carattere
  • (2-17)
    Esempio Attacchi XSS e uso corretto delle entità per i caratteri riservati
  • (2-18)
    Sintassi base XML: le sezioni CDATA
  • (2-19)
    Esempio Il problema degli script incorporati nelle pagine HTML

Lezione 3: HTML /1

03/03/2026, ore 14:30 (2 ore)
Slides HTML

  • (3-1)
    L'evoluzione di HTML
  • (3-2)
    Mantenersi al passo con il living standard: siti di riferimento
    link https://developer.mozilla.org/en-US/docs/Web/HTML
    link https://html.spec.whatwg.org
  • (3-3)
    Controllare e correggere il proprio HTML: i validatori
    link https://validator.w3.org
  • (3-4)
    Standards e Quirks mode per i browser
  • (3-5)
    Struttura base dei documenti HTML4 e HTML5
  • (3-6)
    HTML: elementi blocco e inline
  • (3-7)
    La nuova classificazione degli elementi in HTML5
  • (3-8)
    HTML: gli attributi comuni (id, class, style, title, lang, ...)
  • (3-9)
    Nuovi attributi comuni in HTML5: data, aria,...
    materiale HTML_Examples - HTML5
  • (3-10)
    Esempio Uso degli attributi ARIA nei layout complessi e personalizzati.
    link https://www.w3.org/WAI/standards-guidelines/aria
    link https://www.w3.org/WAI/ARIA/apg/patterns/
  • (3-11)
    HTML: i paragrafi e le interruzioni (p, br)
  • (3-12)
    Esempio Paragrafi vuoti, ritorni a capo, ecc.: tutti i modi sbagliati per aggiungere spazi verticali in un documento
  • (3-13)
    Marcare la struttura base di un documento: gli elementi h
  • (3-14)
    L'importanza semantica del markup corretto
  • (3-15)
    I nuovi elementi di sezionamento in HTML5
    materiale HTML_Examples - HTML5
  • (3-16)
    Esempio Rendering dei vari elementi HTML nei browser
    materiale HTML_Examples
  • (3-17)
    HTML: i contenitori (div, span)
  • (3-18)
    HTML: la formattazione semantica (em, code, pre, ins, q,...)

Lezione 4: HTML /2

05/03/2026, ore 14:30 (2 ore)
Slides HTML

  • (4-1)
    HTML: la formattazione di base (i, b, tt,...)
  • (4-2)
    Esempio Nuovo comportamento di alcuni tag di formattazione in HTML5
    link https://developer.mozilla.org/en-US/docs/Web/HTML/Element/i
  • (4-3)
    Le liste come elemento semantico nei layout complessi
  • (4-4)
    Esempio Creare menu che "degradano bene" usando le liste
    materiale css_menu_multilev_static
  • (4-5)
    HTML: le liste (ol, ul, dl)
  • (4-6)
    HTML: le tabelle (table)
    materiale HTML_Examples - Tables
  • (4-7)
    Gli attributi dell'elemento table in HTML5
  • (4-8)
    Struttura semplice di tabella: righe (tr), celle (td) e celle di intestazione (td)
  • (4-9)
    Struttura completa di tabella: intestazione (thead), corpo (tbody), piè di tabella (tfoot)
  • (4-10)
    Esempio Attenzione all'elemento tbody implicito...
  • (4-11)
    Costruire tabelle complesse con colspan e rowspan
  • (4-12)
    Le immagini nelle pagine web (img)
    materiale HTML_Examples - Images
  • (4-13)
    Accessibilità delle immagini: l'attributo alt
  • (4-14)
    Resizing delle immagini client side
  • (4-15)
    Le mappe immagine server e client side
  • (4-16)
    Collegamenti logici tra risorse (link)
  • (4-17)
  • (4-18)
    Esempio Documenti alternativi
  • (4-19)
    Esempio Collagamento di fogli di stile esterni
  • (4-20)
    Esempio Collegare un feed RSS a una pagina
  • (4-21)
    Esempio Collegare una shortcut icon a una pagina

Lezione 5: HTML /3

10/03/2026, ore 14:30 (2 ore)
Slides HTML

Lezione 6: Java Web Applications

12/03/2026, ore 14:30 (2 ore)
Slides HTML

  • (6-1)
    Gli attributi di validazione in HTML4 e HTML5 (maxlength, min, max, pattern,...)
  • (6-2)
    Esempio Come (e dove) validare i dati inviati da una form
  • (6-3)
    Gli editor testuali (textarea)
  • (6-4)
    I controlli a scelta multipla (select)
  • (6-5)
    Esempio Label e value delle opzioni: quali dati è meglio trasferire al server
  • (6-6)
    Opzioni e raggruppamento (option, optgroup)
  • (6-7)
    Rendering diversi del controllo select
    materiale HTML_Examples - Forms
  • (6-8)
    Esempio Uso delle select come menu nei dispositivi mobili
  • (6-9)
    Etichette accessibili per i controlli (label)
  • (6-10)
    La Java/Jakarta Enterprise Edition (JEE/JakartaEE), le sue versioni e i suoi profili
    link https://www.oracle.com/java/technologies/java-ee-glance.html
    link https://jakarta.ee/about/jakarta-ee/
  • (6-11)
    Installazione (privata) di un ambiente di sviluppo completo (JDK, IDE, server) per applicazioni Java web
  • (6-12)
    Deployment delle Java web application: dall'IDE al server
  • (6-13)
    Una nuova modalità di deployment per le Java web application: JAR con server embedded

Lezione 7: Java Servlets /1

17/03/2026, ore 14:30 (2 ore)
Slides Servlets
Materiale JakartaEE Web Application tutorial

Lezione 8: Java Servlets /2

19/03/2026, ore 14:30 (2 ore)
Slides Servlets
Materiale JakartaEE Servlet tutorial

  • (8-1)
    Esempio Aggiungere una nuova servlet in una web application
  • (8-2)
  • (8-3)
    Le interfacce base delle servlet: Servlet, ServletRequest, ServletResponse
  • (8-4)
    Il ciclo di vita di una servlet: inizializzazione, servizio, finalizzazione
  • (8-5)
    Inizializzare e finalizzare una servlet: metodi init e destroy
  • (8-6)
    La classe HttpServlet e i metodi doGet e doPost
  • (8-7)
    Multithreading con la classe HttpServlet: variabili per-thread e condivise
  • (8-8)
    Scrivere informazioni verso il client: la classe HttpServletResponse
  • (8-9)
    Output testuale e binario da una servlet
  • (8-10)
    Esempio La servlet "Salutami"
  • (8-11)
    Scrittura degli headers e del payload di un messaggio HTTP

Lezione 9: Java Servlets /3

24/03/2026, ore 14:30 (2 ore)
Slides Servlets

  • (9-1)
    Esempio Il project object model (POM) di una semplice web application
  • (9-2)
    Comunicazione tra gli strati dell'applicazione tramite gli attributi della HttpServletRequest
  • (9-3)
    Gestire efficacemente gli errori e le eccezioni in una servlet
  • (9-4)
    Restituire codici di errore HTTP da una servlet
  • (9-5)
    Gestire l'input utente: uso della classe HttpServletRequest
  • (9-6)
    Elaborazione delle form in modalità GET: i metodi getParameter e getParameterValues
  • (9-7)
    Validare l'input per prevenire attacchi (come la SQL Injection)
  • (9-8)
    Sanitizzare l'output per prevenire attacchi XSS
  • (9-9)
    Esempio La servlet "Salutami" anonima e personalizzata
    materiale Java_Example_Servlet
  • (9-10)
    Incapsulare la logica di output e separare meglio gli strati dell'applicazione
  • (9-11)
    Esempio La servlet "Salutami" con una struttura avanzata
    materiale Java_Example_Servlet_Fwk
  • (9-12)
    Trasmissione di dati binari dalla servlet al client
  • (9-13)
    Considerazioni sulla sicurezza: perchè e come scrivere una download servlet

Lezione 10: Java Servlets /4

26/03/2026, ore 14:30 (2 ore)
Slides Servlets

  • (10-1)
    Alcuni header interessanti: Content-Type, Content-Disposition e Content-Length
  • (10-2)
    Esempio Scrivere una download servlet
    materiale Java_Example_Downloader
  • (10-3)
    Incorporare in una pagina HTML immagini generate da una servlet
  • (10-4)
    Esempio Scrivere una servlet che trasmette immagini al client
    materiale Java_Example_Imager
  • (10-5)
    Elaborazione delle form in modalità POST con codifica url
  • (10-6)
    Elaborazione delle form con codifica multipart
  • (10-7)
    L'elemento multipart-config
  • (10-8)
    Gestione dei file caricati con getPart()
  • (10-9)
    Esempio La servlet "Uploadami" con upload di file
    materiale Java_Example_Servlet_Multipart_7
  • (10-10)
    Esempio Rendere sicure le applicazioni web che accettano upload di file
    link https://cheatsheetseries.owasp.org/cheatsheets/File_Upload_Cheat_Sheet.html
  • (10-11)
    Sanitizzazione dei nomi dei file

Lezione 11: Java Servlets /5

31/03/2026, ore 14:30 (2 ore)
Slides Servlets

Lezione 12: Sessioni e Sicurezza

09/04/2026, ore 14:30 (2 ore)
Slides Servlets

Lezione 13: Web Applications e Database

14/04/2026, ore 14:30 (2 ore)
Slides Servlets

  • (13-1)
    Java e i DBMS: richiami sulle nozioni di base del JDBC
  • (13-2)
    Esempio JDBC: aggiungere la dipendenza del driver al POM del progetto
  • (13-3)
    Esempio JDBC: le classi principali (Connection, (Prepared)Statement, ResultSet)
  • (13-4)
    Esempio JDBC: aprire una connessione tramite il DriverManager (sconsigliato nelle applicazioni web!)
  • (13-5)
    Esempio JDBC: eseguire query di inserimento, aggiornamento, cancellazione
  • (13-6)
    Esempio JDBC: eseguire query di selezione
  • (13-7)
    JDBC: chiudere le risorse (resultset, statement e connessioni)
  • (13-8)
    JDBC: precompilazione di query (parametriche)
  • (13-9)
    Esempio Le ragioni per usare un PreparedStatement in una web application: sicurezza (contro la SQL Injection)
  • (13-10)
    Esempio Quando aprire una connessione in una web application/servlet e quando chiuderla
  • (13-11)
    Performance nell'accesso ai dati nelle applicazioni web: il problema delle connessioni
  • (13-12)
    Riutilizzare le connessioni JDBC: il connection pooling
  • (13-13)
    Configurare una sorgente dati JDBC in Tomcat (context.xml)
    link https://tomcat.apache.org/tomcat-11.0-doc/jdbc-pool.html
  • (13-14)
    Riferimento alle risorse nel deployment descriptor
  • (13-15)
    Utilizzare i servizi di naming di Java per ottenere un DataSource
  • (13-16)
    Utilizzare la resource injection di JavaEE per ottenere un DataSource
    link https://jcp.org/en/jsr/detail?id=250
  • (13-17)
    JDBC: aprire una connessione tramite il DataSource (consigliato nelle applicazioni web!)
  • (13-18)
    Esempio Uso del JDBC con connection pooling
    materiale Java_Example_Servlet_Database
  • (13-19)
    Esempio Esempio finale sulle form e i database: un file repository
    materiale Java_Example_Uploader
  • (13-20)
    Esempio Come calcolare il digest di un file
  • (13-21)
    Esempio JDBC: Creare un ResultSet non FORWARD_ONLY e contare il numero di resultati
  • (13-22)
    Esempio JDBC: Leggere le chiavi auto-generate dopo un inserimento
  • (13-23)
    Presentazione dei progetti d'esame

Lezione 14: Modellazione Dati /1

16/04/2026, ore 14:30 (2 ore)

  • (14-1)
    La realizzazione di un'applicazione web secondo il pattern MVC: il modello dei dati, la logica, la presentazione
  • (14-2)
    Il modello a oggetti dei dati come contratto tra i livelli MVC
  • (14-3)
    Creazione di POJO - JavaBeans per rappresentare le entità del modello dati
  • (14-4)
    Costruire un POJO corretti: costruttore di default, getters e setters
  • (14-5)
    Esempio Creazione degli oggetti entità: interfaccia e implementazione
  • (14-6)
    Esempio Il modello dati newspaper: un esempio di design e implementazione di un modello dati su MySQL
    materiale Java_Example_SimpleDataModel
  • (14-7)
    L'interfaccia a basso livello degli oggetti entità: i proxy
  • (14-8)
    Esempio Marcare gli oggetti entità come modificati nei setter
  • (14-9)
    Esempio Lazy loading delle relazioni: perchè è importante e come si realizza
  • (14-10)
    Creazione dei metodi di accesso ai dati: i DAO
  • (14-11)
    Esempio Factory per oggetti entità
  • (14-12)
    Esempio Caching degli oggetti entità: perchè è importante e come si realizza

Lezione 15: CSS /1

21/04/2026, ore 14:30 (2 ore)
Slides CSS3
Materiale CSS_Examples

  • (15-1)
    Cenni sulle tecniche di locking ottimistico e pessimistico per gestire la concorrenza
  • (15-2)
    Esempio Esempio riassuntivo: un'applicazione base che mostra come realizzare e far interagire model e controller in modo efficace
    materiale Java_Example_BaseApplicationMC
  • (15-3)
    Presentazione dei fogli di stile CSS
  • (15-4)
    Incorporare i fogli di stile in HTML: elementi style e link
  • (15-5)
    Fogli di stile multipli per uno stesso documento
  • (15-6)
    Fogli di stile persistenti, preferiti e alternativi (scelta utente)
  • (15-7)
    Fogli di stile alternativi legati ai media
  • (15-8)
    Esempio Accorgimenti per la creazione di figli di stile per la stampa (media="print")
    materiale css_inclusion_print
  • (15-9)
    Sintassi delle regole CSS
  • (15-10)
    I selettori semplici
    materiale css_selectors
  • (15-11)
    Selettori di base
  • (15-12)
    Selettori di attributo
  • (15-13)
    Selettori di classe
    materiale css_selectors
  • (15-14)
    Esempio Classi come attributi speciali
  • (15-15)
    Selettori di ID
  • (15-16)
    Forma abbreviata dei selettori di classe e di ID
  • (15-17)
    Esempio Identificare e formattare le strutture di base di un layout
  • (15-18)
    Pseudo classi
  • (15-19)
    Esempio Effetti hover sui link
  • (15-20)
    Esempio Effetti focus sugli input
  • (15-21)
    La pseudo classe :hover nei browser legacy
  • (15-22)
    Esempio Inserire bordi interni in una lista di elementi
  • (15-23)
    Pseudo elementi
  • (15-24)
    Esempio Creare un capolettera
  • (15-25)
    Esempio Aggiungere testo a un documento con i CSS
  • (15-26)
    I selettori composti

Lezione 16: CSS /2

23/04/2026, ore 14:30 (2 ore)
Slides CSS3
Materiale CSS_Examples

  • (16-1)
    I selettori composti
  • (16-2)
    Le regole di selezione delle proprietà di stile
  • (16-3)
    Priorità di origine, specificità e ordinamento delle regole
  • (16-4)
    Il modificatore !important
  • (16-5)
    Esempio Rispetto delle regole di cascata nei browser
    materiale css_cascade
  • (16-6)
    Ereditarietà delle proprietà di stile
  • (16-7)
    Usare il CSS inspector del browser per analizzare gli stili e la loro composizione
    link https://firefox-source-docs.mozilla.org/devtools-user/page_inspector/how_to/examine_and_edit_css
    link https://developer.chrome.com/docs/devtools/css
  • (16-8)
    Unità di misura nei CSS
  • (16-9)
    Uso delle misure relative per aumentare l'accessibilità di un sito
  • (16-10)
    Uso delle misure percentuali nei design liquidi e responsive
  • (16-11)
    Specifica dei colori nei CSS
  • (16-12)
    Aggiungere bordi agli elementi
    materiale css_properties_common
  • (16-13)
    Alcune nuove proprietà CSS3 per i box: border-radius e box-shadow
  • (16-14)
    Prefissi dei vendor sulle proprietà css e compatibilità con i browser legacy
  • (16-15)
    Esempio Creare bordi smussati senza immagini con i CSS 3
    materiale css_3_round_borders
  • (16-16)
    Esempio CSS3 avanzato: bordi realizzati con immagini
    materiale css_3_imageborders

Lezione 17: CSS /3

28/04/2026, ore 14:30 (2 ore)
Slides CSS3
Materiale CSS_Examples

  • (17-1)
    Esempio Creare ombre con i CSS 3
    materiale css_3_shadows
  • (17-2)
    Modificare lo sfondo di un elemento
  • (17-3)
    Uso di immagini come sfondo: ripetizione e allineamento
  • (17-4)
    La tecnica dei CSS sprites
    materiale css_sprites
  • (17-5)
    Proprietà di formattazione dei caratteri
  • (17-6)
    Specificare font multipli per assicurare compatibilità tra le piattaforme
  • (17-7)
    Le web fonts e la at-rule @font-face
  • (17-8)
    Esempio Importare una web font da Google usando la regola @font-face
    materiale css_3_webfonts
  • (17-9)
    Proprietà di formattazione dei paragrafi
  • (17-10)
    Formattare le liste con i CSS
  • (17-11)
    Esempio Creare semplici menu con le liste CSS
    materiale css_menu_multilev_static
  • (17-12)
    Altre proprietà dei CSS: content, quotes, cursor,...
  • (17-13)
    Esempio Esempi d'uso delle proprietà cursor, content, quotes e counter
    materiale css_properties_misc
  • (17-14)
    Esempio CSS3 avanzato: le transizioni di proprietà
    materiale css_3_transitions
  • (17-15)
    Esempio CSS3 avanzato: modificare l'opacità di un oggetto
    materiale css_3_transitions
  • (17-16)
    Esempio CSS3 avanzato: realizzare animazioni con i keyframes
    materiale css_3_animation
  • (17-17)
    Cenni sulle variabili (custom properties) CSS
    materiale css_3_variables
  • (17-18)
    Cenni sulle funzioni CSS var() e calc()

Lezione 18: CSS /4

30/04/2026, ore 14:30 (2 ore)
Slides CSS3
Materiale CSS_Examples

  • (18-1)
    Cambiare il sistema di display degli elementi con i CSS
  • (18-2)
    Esempio Creare elementi popup usando la proprietà display e la pseudo class :hover
    materiale css_properties_display
  • (18-3)
    Il box model dei CSS
  • (18-4)
    Cambiare la visibilità degli elementi con CSS
  • (18-5)
    Gestione del contenuto degli elementi: la proprietà overflow
  • (18-6)
    Esempio Testo scorrevole in elementi arbitrari
    materiale css_properties_overflow
  • (18-7)
    Esempio Clipping del contenuto di un elemento
  • (18-8)
    Esempio Scrolling alternativo con CSS e Javascript
  • (18-9)
    Definire margini e padding con i CSS
  • (18-10)
    Impostare l'altezza e la larghezza (minime, massime, effettive o relative) di un elemento
  • (18-11)
    Width, height e la proprietà box-sizing
  • (18-12)
    I sistemi di posizionamento dei CSS
  • (18-13)
    L'algoritmo di disposizione degli oggetti nelle pagine HTML
  • (18-14)
    Disposizione degli elementi blocco e inline
  • (18-15)
    Il posizionamento sulla terza dimensione: la proprietà z-index
  • (18-16)
    Posizionamento relativo
  • (18-17)
    Esempio Esempi di posizionamento relativo
    materiale css_properties_positioning_relative
  • (18-18)
    Posizionamento assoluto
  • (18-19)
    Esempio Esempi di posizionamento assoluto
    materiale css_properties_positioning_absolute
  • (18-20)
    L'origine delle coordinate nel posizionamento assoluto
  • (18-21)
    Esempio Realizzare layouts con il posizionamento assoluto
  • (18-22)
    Esempio Combinare il posizionamento e le proprietà margin per creare layouts
  • (18-23)
    Posizionamento fisso
  • (18-24)
    Esempio Esempi di posizionamento fisso
    materiale css_properties_positioning_fixed
  • (18-25)
    Esempio Realizzare menu e banner sempre visibili col posizionamento fisso
  • (18-26)
    I floats
  • (18-27)
    Esempio Uso dei floats per realizzare layout a più colonne ed altri effetti
    materiale css_properties_positioning_float
  • (18-28)
    Introduzione ai CSS Flexbox
    materiale css_3_flexbox

Lezione 19: (Responsive) Web design

05/05/2026, ore 14:30 (2 ore)
Slides CSS3
Materiale CSS_Examples, CSS_Examples: layouts

  • (19-1)
    Progettare un sito web: linee guida di stile e usabilità
  • (19-2)
    Costruire il layout di un sito web: layout fissi e liquidi
  • (19-3)
    Esempio I layout di base: layout a colonna singola
  • (19-4)
    Esempio I layout di base: layout due colonne
  • (19-5)
    Esempio Uso di elementi posizionati per la realizzazione di layout molticolonna
  • (19-6)
    Esempio Uso di floats per la realizzazione di layout molticolonna
  • (19-7)
    Esempio Uso dei flexbox per la realizzazione di layout molticolonna
  • (19-8)
    Introduzione al responsive web design
  • (19-9)
    Le CSS media queries
  • (19-10)
    Usare l'effetto cascata dei CSS per modificare le regole di default tramite una media query
  • (19-11)
    CSS media queries per il responsive disign: i responsive breakpoints
  • (19-12)
    Come adattare un layout a device diversi con i CSS: spostare, ridimensionare, nascondere, sostituire
  • (19-13)
    Esempio Realizzare un menu alternativo accessibile con il controllo SELECT (...e un bottone)
  • (19-14)
    I layout a griglia
  • (19-15)
    Esempio Il layout a griglia fluido responsive realizzato con i float
    materiale Layout_3col_grid_float_liquid
  • (19-16)
    Esempio Un layout a griglia fluido realizzato con i flexbox
    materiale Layout_3col_grid_flexbox_liquid
  • (19-17)
    Introduzione ai CSS Grid
    materiale css_3_grid
  • (19-18)
    Esempio Un layout a griglia fluido realizzato con i CSS grid
    materiale Layout_3col_grid_grid_liquid
  • (19-19)
    Introduzione ai template

Lezione 20: Templates

07/05/2026, ore 14:30 (2 ore)
Materiale Java_Example_Templates