Dispense di Tecnologie Web

Description

Abstract Questo documento raccoglie gli appunti del primo modulo del corso Intelligenza Artificiale e Tecnologie Web tenuto dalla Professoressa Laura Po. Contents 1 Storia del Web 6 1.1 Il contesto storico e i precursori . . . . . . . . . . . . . . . . . . . . . . . . 6 1.2 La Nascita del World Wide Web . . . . . . . . . . . . . . . . . . . . . . . . 7 1.3 Il concetto chiave: l’ipertesto distribuito . . . . . . . . . . . . . . . . . . . 7 1.4 Gli elementi costitutivi e il modello client-server . . . . . . . . . . . . . . . 8 1.5 I client e i server . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 8 2 Hyper-Text Transfer Protocol 9 2.1 La terminologia . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 9 2.2 Il TCP/IP . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 10 2.3 L’HTTP . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 11 2.4 La latenza . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 12 2.5 I messaggi HTTP . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 13 2.6 I cookies e la sicurezza . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 15 2.7 Gli intermediari in HTTP . . . . . . . . . . . . . . . . . . . . . . . . . . . 16 3 HTML e CSS 17 3.1 Introduzione al Web . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 17 3.2 La struttura di un documento HTML . . . . . . . . . . . . . . . . . . . . . 18 3.3 La struttura di un documento CSS . . . . . . . . . . . . . . . . . . . . . . 20 4 Javascript 22 4.1 Il cervello delle pagine HTML . . . . . . . . . . . . . . . . . . . . . . . . . 22 4.2 L’inserimento di JavaScript in HTML . . . . . . . . . . . . . . . . . . . . . 22 4.3 La sintassi e i tipi di dati . . . . . . . . . . . . . . . . . . . . . . . . . . . . 23 4.4 Gli esempi pratici . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 23 5 DOM 24 5.1 L’albero che d`a vita al web . . . . . . . . . . . . . . . . . . . . . . . . . . . 24 5.2 La gestione degli eventi . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 25 3 6 Form e validazione 26 6.1 I form HTML . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 26 6.2 La validazione integrata e personalizzata . . . . . . . . . . . . . . . . . . . 27 7 Javascript e gli eventi 28 7.1 Le capacit`a di JavaScript . . . . . . . . . . . . . . . . . . . . . . . . . . . . 28 7.2 La gestione dei form . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 29 8 Web dinamico 30 8.1 Il modello dinamico: CGI . . . . . . . . . . . . . . . . . . . . . . . . . . . 30 8.2 Le architetture Web e la gestione dello stato . . . . . . . . . . . . . . . . . 31 9 Ajax e XMLHTTPRequest 32 9.1 I predecessori di AJAX . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 32 9.2 Il cuore della comunicazione: XMLHttpRequest . . . . . . . . . . . . . . . 33 9.3 Il Formato di scambio preferito: JSON . . . . . . . . . . . . . . . . . . . . 33 9.4 I vantaggi e gli svantaggi . . . . . . . . . . . . . . . . . . . . . . . . . . . . 34 10 Fetch 35 10.1 Le caratteristiche e i vantaggi . . . . . . . . . . . . . . . . . . . . . . . . . 35 10.2 Il confronto tra XHR e Fetch . . . . . . . . . . . . . . . . . . . . . . . . . . 36 11 Web application e framework 37 11.1 Le componenti delle Web application . . . . . . . . . . . . . . . . . . . . . 37 11.2 I Web framework . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 39 12 React 40 12.1 La libreria . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 40 12.2 L’utiliizzo . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 41 13 Application Programming Interface 43 13.1 Le interfacce . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 43 14 Search Engine Optimization 45 14.1 Il ranking delle pagine web . . . . . . . . . . . . . . . . . . . . . . . . . . . 45 4 14.2 Il SEO . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .