introduzione

zero

Rappresentazione digitale delle informazioni

Informazioni e dati. Come le informazioni vengono codificate per poter essere elaborate da un calcolatore elettronico. La codifica dei caratteri, dei numeri, delle immagini. La rappresentazione digitale di un segnale analogico. Suono e filmati. Tecniche di compressione lossy e tecniche di compressione lossless. I file archivio. Le tecniche di compressione dedicate (immagini, suono, filmati).

internet

uno 

Come funziona internet

Architettura client server, url e uri, Struttura dell’uri,, Web server e browser, Le applicazioni web, Pagine statiche e pagine dinamiche.

HTML

Formattazione… e semantica. Marcatori (tag), Attributi, Entity e Commenti. Il W3C. Validazione e controllo sintassi.

XHTML

XML è un metalinguaggio. Regole di Base. HTML + XML = XHTML. DTD Strict, DTD Trasitional, DTD Frameset

HTML 5

Header, Hgroup, Article, time, nav, aside, footer, Video e canvas.

Struttura della pagina HTML

Prologo, HEAD, BODY. Elementi blocco, Elementi INLINE, Attributi di body, Validare le pagine

due

CSS

Foglii Collegati, Stili Incorporati, Stili in linea.

Regole e selettori

Sintassi abbreviata, Selettori, Elementi, Selezione degli elementi in base ai loro attributi, Classi e Id, Pseudo-classi.

Proprietà dei blocchi

Background, margin, padding, float

programmare il browser

Costruire interfacce interattive utilizzando la programmazione lato client: Javascript e il browser, Gli applet e la Java Virtual Machine, Filmati Flash e Adobe Virtual Machine. Linguaggi di programmazione lato server. Principali ambienti di sviluppo: Internet Information Server (Microsoft) e ASP.NET, Linux e PHP. I CMS.

tre

Cosa è javascript

Linguaggi compilati, semicompilati e interpretati. Javascript non è java. Un po' di storia.

Il Document Object Model

Struttura minima di una pagina HTML. La struttura del dom: document, window, navigator, screen, history, location. La strttura ad albero. Object reference: dare un nome ad un nodo. Object. Proprietà e metodi. Rappresentazione del DOM. Gli eventi.

quattro

Javascript come, cosa, dove e quando

L'interprete javascript. La funzione eval. Javascript agisce sul  dom. Come inserire uno script in una pagina: e tag script e noscript. Quando viene eseguito uno script

Elementi del linguaggio

Che cosa è una variabile e a che cosa serve. Dati semplici e dati complessi: gli oggetti Array e Object.

La programmazione Condizionale e la programmazione Iterativa

L’algebra di Boole. Operatori logici e tabelle di verità. I costrutti che servono a verificare delle condizioni e a modificare di conseguenza il flusso del programma: if, else, e else if. I costrutti: while e for per gestire le procedure iterative. Uso difor per effettuare una ricerca in un Array.

Funzioni ed eventi

Organizziamo meglio il nostro lavoro di progettazione con le funzioni. Funzioni con nome e funzioni anonime. Le funzioni come metodi di un oggetto. Eventi di sistema e interazione con l’utente: eventi sincroni e eventi asincroni. Mouse e tastiera, timer, caricamento dati, altri eventi dilazionati. Uso delle funzioni per la gestione degli eventi.

cinque

Oggetti e classi

Cosa è un oggeto. Oggetti e scopo delle variabili e delle funzioni. Proprietà e metodi. Gli oggetti predefiniti dal linguaggio: Array, Date, Math, String, Number; RgeEx. Il costrutto fpr...in.

sei

L'oggetto document

La struttura del DOM (Document Object Model) come organizzazione gerarchica di oggetti. Metodi e proprietà per manipolare il documento HTML. Le differenze tra i browser. 

I nodi

La metafora dell'albero. Proprità e metodi dei nodi. Padri e figli: i legami tra gli oggetti. Differenza tra varibili che contengono un valore e variabili che contengono un riferimento.

Altri ogetti

Gestione delle tabelle. L'oggetto localStorage e l'oggetto JSON.

jQuery

sette

Le librerie (o framework) Javascript

Programmare in Javascript utilizzando un framework. I Framework più diffusi. Come inserire jQuery in una pagina Web. L'evento $(document).ready(). La funtione $(). Ricerca di elementi: elemento, id, classe, pseudoselettori. Chaining, getters e setters. I metodi offerti da jQuery. Gli eventi in jQuery. 

otto

Tecologia AJAX

Composizione di una pagina utilizzando la programmazione lato server e usando l'oggetto XMLHttpRequest (AJAX). I metodi jQuesry per AJAX.

I Plug-in per jQuery

Come utilizzare un plug-in esistente. 

Canvas

Il nuovo elemento HTML canvas (HTML5) e jCanvas, estensioni di jQuery per disegnare.

esercitazioni

uno

Riferimento ad un oggetto

Comporre dinamicamente nella pagina Web un messaggio di benvenuto che comprenda la data.

due

La funzione eval

Creare una semplice interfaccia per l'esecuzione interattiva di comandi javascript utilizzando la funzione eval. 

tre

Costrutto if a più scelte

Confrontare due numerimeri e comporre un messaggio appropriato se il secondo numero è minore, uguale o maggiore.

Utilizzo di Array

Scrivere la data corrente utilizzando il nome italiano di mesi e giorni della settimana.

Ricerca di una stringa in un Array

Creazione di una semplice interfaccia che consente di cercare una stringa in un array di stringhe e indica la posizione in cui viene trovata o, in alternativa, risponde con un messaggio appropriato.

quattro

Utilizzo di Date e dei timer

Inserimento in una pagina Web di un orologio calendario da aggiornare in tempo reale.

Calcolo dell'età

Calcolo dell'età utilizzando l'oggetto date, e una semplice interfaccia che consente all'utente di inserire la propria data di nascita.

cinque

Creazione di una rubrica telefonica

Creazione di un'interfaccia per inserire nome, cognome e numero di telefono in un array di oggetti. Visualizzazione dell'array costruendo un oggetto table con javascript. Memolizzazione dei dati utilizzando gli oggetto localStorage e JSON.

sei

Caricamento contenuti esterni utilizzando la tecnologia AJAX

Utilizzando jQuery e i comandi AJAX caricare dinamicamente il contenuto del menu delle pagine del sito dedicato alle esercitazioni.

Esercitazioni con jQuery

Trocare elementi. Inserire testo in specifici punti della pagina web. Leggere i dati di un form e scrivere un messaggio di risposta che dipende dai dati inseriti. Associare l'animazione di un elemento ad un evente del mouse.

sette

Una galleria di immagini

Creazioe di una galleria di immagini con un plug-in per jQuery.

Disegni su canvas

Utilizzare jCanvas per disegnare delle figure geometrica sull'elemento canvas.

otto

Dadi

Simulare il lancio dei dadi con jCanvas.

nove

Gestione completa di una commessa

Realizzazione di un semplice sito WEB sulla base di un layout fornito dal cliente cercando di utilizzare tutte le conoscenze apprese durante il corso.