Diario delle Lezioni - A.A. 2024/2025

Lezioni totali: 10, ore erogate: 20 (41%) - Prima lezione: 25/02/2025, Ultima lezione: 27/03/2025

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

25/02/2025, ore 16: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à, mobile first,...
  • (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

27/02/2025, 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

Lezione 3: HTML /1

04/03/2025, ore 16:30 (2 ore)
Slides HTML

  • (3-1)
    Sintassi base XML: le sezioni CDATA
  • (3-2)
    Esempio Il problema degli script incorporati nelle pagine HTML
  • (3-3)
    L'evoluzione di HTML
  • (3-4)
    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-5)
    Controllare e correggere il proprio HTML: i validatori
    link https://validator.w3.org
  • (3-6)
    Concetti di base URI, URL, media types...
  • (3-7)
    Standards e Quirks mode per i browser
  • (3-8)
    Struttura base dei documenti HTML4 e HTML5
  • (3-9)
    HTML: elementi blocco e inline
  • (3-10)
    La nuova classificazione degli elementi in HTML5
  • (3-11)
    HTML: gli attributi comuni (id, class, style, title, lang, ...)
  • (3-12)
    Nuovi attributi comuni in HTML5: data, aria,...
    materiale HTML_Examples - HTML5
  • (3-13)
    Esempio Uso degli attributi ARIA nei layout complessi e personalizzati.
    link https://www.w3.org/WAI/standards-guidelines/aria
  • (3-14)
    HTML: i paragrafi e le interruzioni (p, br)
  • (3-15)
    Esempio Paragrafi vuoti, ritorni a capo, ecc.: tutti i modi sbagliati per aggiungere spazi verticali in un documento
  • (3-16)
    Marcare la struttura base di un documento: gli elementi h
  • (3-17)
    L'importanza semantica del markup corretto
  • (3-18)
    I nuovi elementi di sezionamento in HTML5
    materiale HTML_Examples - HTML5
  • (3-19)
    Esempio Rendering dei vari elementi HTML nei browser
    materiale HTML_Examples
  • (3-20)
    HTML: i contenitori (div, span)
  • (3-21)
    HTML: la formattazione semantica (em, code, pre, ins, q,...)
  • (3-22)
    HTML: la formattazione di base (i, b, tt,...)
  • (3-23)
    Esempio Nuovo comportamento di alcuni tag di formattazione in HTML5
    link https://developer.mozilla.org/en-US/docs/Web/HTML/Element/i

Lezione 4: HTML /2

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

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

Lezione 5: HTML /3

11/03/2025, ore 16:30 (2 ore)
Slides HTML

  • (5-1)
    I collegamenti ipertestuali (a)
  • (5-2)
    Ancore nei documenti e fragment identifiers
  • (5-3)
    Esempio Saltare rapidamente al contenuto di una pagina
  • (5-4)
    Differenze tra metodo GET e POST
  • (5-5)
    I moduli in HTML (form)
  • (5-6)
    Attributi importanti delle form: action, method, enctype e accept-charset
    link https://developer.mozilla.org/en-US/docs/Web/HTML/Element/form
  • (5-7)
    La codifica dei dati nelle form
  • (5-8)
    Esempio Scegliere la giusta combinazione di metodo ed encoding per una form
  • (5-9)
    Esempio Il pattern POST-Redirect-GET per la sottomissione di form
    link https://en.wikipedia.org/wiki/Post/Redirect/Get
    materiale Java_Example_Post_Redirect_Get
  • (5-10)
    Esempio Usare accept-charset per risolvere ulteriori problemi di encoding (stavolta tra il client e il server)
  • (5-11)
    Gli elementi di input utente (input)
  • (5-12)
    Esempio Confronto del rendering in vari browser per i controlli di input
    materiale HTML_Examples - Forms
  • (5-13)
    Esempio I valori sottomessi da campi non testuali: file, checkbox, radio,...
  • (5-14)
    Esempio Impedire la trasmissione di un campo di form con l'attributo disabled

Lezione 6: Java Web Applications

13/03/2025, ore 14:30 (2 ore)
Slides HTML, Servlets

Lezione 7: Java Servlets /1

18/03/2025, ore 16:30 (2 ore)
Slides Servlets
Materiale JakartaEE Web Application tutorial, JavaEE (legacy) specification

  • (7-1)
    Presentazione del Netbeans IDE
  • (7-2)
    Presentazione e installazione del server Apache Tomcat
  • (7-3)
    Esempio Suggerimenti utili per collegare Netbeans e Tomcat
  • (7-4)
    Le servlet e i container
  • (7-5)
    Introduzione alla programmazione delle servlet
  • (7-6)
    Il contesto di una web application e l'url mapping nei servlet container
  • (7-7)
    La struttura di base di una web application
  • (7-8)
    Struttura (fisica) di una web application
  • (7-9)
    Esempio Creare una nuova applicazione web
    materiale Java_WebApp_Base_T10
  • (7-10)
    Esempio Compilazione, deploy ed esecuzione di una web application
  • (7-11)
    Esempio Aggiungere risorse statiche (html, css, ecc.) a una web application
  • (7-12)
    Esempio Il project object model (POM) di una semplice web application
  • (7-13)
    Il file di configurazione del contesto (context.xml)
    link https://tomcat.apache.org/tomcat-10.0-doc/appdev/deployment.html

Lezione 8: Java Servlets /2

20/03/2025, 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
  • (8-12)
    Comunicazione tra gli strati dell'applicazione tramite gli attributi della HttpServletRequest
  • (8-13)
    Gestire efficacemente gli errori e le eccezioni in una servlet
  • (8-14)
    Restituire codici di errore HTTP da una servlet

Lezione 9: Java Servlets /3

25/03/2025, ore 16:30 (2 ore)
Slides Servlets

  • (9-1)
    Gestire l'input utente: uso della classe HttpServletRequest
  • (9-2)
    Elaborazione delle form in modalità GET: i metodi getParameter e getParameterValues
  • (9-3)
    Validare l'input per prevenire attacchi (come la SQL Injection)
  • (9-4)
    Sanitizzare l'output per prevenire attacchi XSS
  • (9-5)
    Esempio La servlet "Salutami" anonima e personalizzata
    materiale Java_Example_Servlet
  • (9-6)
    Incapsulare la logica di output e separare meglio gli strati dell'applicazione
  • (9-7)
    Esempio La servlet "Salutami" con una struttura avanzata
    materiale Java_Example_Servlet_Fwk
  • (9-8)
    Trasmissione di dati binari dalla servlet al client
  • (9-9)
    Considerazioni sulla sicurezza: perchè e come scrivere una download servlet
  • (9-10)
    Alcuni header interessanti: Content-Type, Content-Disposition e Content-Length
  • (9-11)
    Esempio Scrivere una download servlet
    materiale Java_Example_Downloader
  • (9-12)
    Incorporare in una pagina HTML immagini generate da una servlet
  • (9-13)
    Esempio Scrivere una servlet che trasmette immagini al client
    materiale Java_Example_Imager

Lezione 10: Java Servlets /4

27/03/2025, ore 14:30 (2 ore)
Slides Servlets