Il seminario è progettato per offrire agli studenti una solida comprensione delle tecnologie essenziali per lo sviluppo web, come HTML, CSS e JavaScript.
Sviluppato con gli studenti del Bachelor of Arts in Comunicazione Visiva (2° e 3° Anno) della Scuola universitaria professionale della Svizzera italiana (SUPSI), il seminario della durata di una settimana si articola in due fasi principali: familiarrizazione e messa in pratica.
Durante la prima parte la classe inizierà a familiarizzare con HTML, CSS e JavaScript vanilla attraverso lezioni mirate all'apprendimento del vocabolario e della sintassi di sviluppo.
Durante la seconda fase invece le studentesse e gli studenti avranno la possibilità di acquisire esperienza attraverso lo sviluppo di un progetto personale dove mostrare quanto acquisito.
Matteo Subet
matteo.subet@supsi.ch
Il programma della settimana si articola in 2 diversi fasi: familiarizzare con i linguaggi HTML, CSS e Javascript e creare un progetto personale.
Durante la prima fase, le studentesse e gli studenti potranno comprendere meglio la teoria tecnica dei linguaggi proposti e metterli in pratica con micro-attività pratiche.
Durante la seconda, potranno invece integrare i tre linguaggi esplorati i giorni precedenti in un progetto individuale che possa restituire il lavoro svolto durante la settimana.
Di seguito il dettaglio delle lezioni della settimana:
| Mattino (09.05 - 12.20) | Pomeriggio (13.30 - 16.30) | Slides | |
|---|---|---|---|
| Lunedì | - Introduzione seminario - Obiettivi - Strumenti utilizzati - Introduzione HTML |
- Introduzione HTML - Gli attributi HTML |
Link |
| Martedì | - Breve ripasso - Introduzione CSS |
- Introduzione CSS | Link |
| Mercoledì | - Breve ripasso - Introduzione JavaScript |
- Introduzione JavaScript | Link |
| Giovedì | - Approfondimento JavaScript | - Progetto collettivo | Link |
| Venerdì | - Programmazione coadiuvata - Lavoro individuale con supporto |
- Lavoro individuale con supporto - Documentazione progetto |
- |
Il programma è stato basato su i corsi HTML e CSS di CodeAcademy
Come strumento di condivisione del lavoro verrà utilizzato GitHub per permettere a chi seguirà il seminario di entrare in contatto con uno strumento largamente utilizzato in ambito professionale.
La repository Fondamenti-Programmazione-Web-24 verrà suddivisa in due principali sezioni: Lezioni e Attività.
Nella sezione Lezioni, sono incluse tutte le lezioni di introduzione alla programmazione web suddivise per tematica: HTML, CSS e JavaScript. Ogni sezione avrà un testo di accompagnamento dove verrà illustrato il programma specifico e inclusi link a esempi pratici.
Nella sezione Attività, è presente una cartella per partecipante al corso con una suddivisione tra Mini-attività e Progetto finale.
Il seminario è progettato per fornire alle studentesse e agli studenti una base solida nelle tecnologie fondamentali per lo sviluppo web, quali HTML, CSS e JavaScript. L'obiettivo principale è di preparare le studentesse e gli studenti a gestire in modo autonomo la costruzione e la gestione di semplici pagine web, competenze che saranno essenziali per affrontare i corsi avanzati previsti nel loro percorso accademico e professionale.
Di seguito il sommario dei contenuti proposti per il seminario, il dettaglio per ogni punto è disponibile all'interno della sezione Lezioni -> HTML/CSS/JavaScript.
- Anatomia
- Il Body
- La struttura
- I componenti
- Gli standard
- Anatomia
- Stile inline
- Foglio di stile
- Attributi tag HTML
- Selettori
- Box Model
- Display and Positioning
- Colori
- Tipografia
- Logica di base
- Interazione JavaScript DOM/HTML
- Interazione JavaScript DOM/Browser
La repository del seminario può essere modificata e integrata in qualsiasi sua parte. Se per esempio vedete un errore e/o credete si possa integrare il testo in ogni sua parte o forma siete liberi di poter inviare la modifica.
Per poter sottomettere una modifica o caricare i propri file, utilizzare la branch dev, verrà poi integrata all'interno della branch main ogni fine giornata o dopo ogni aggiornamento importante. Questo permetterà di mantenere la repository ordinata.
Per essere sicuri di modificare la branch dev controllare sull'applicazione GitHub Desktop che la branch selezionata sia quella corretta. Nel caso in cui abbiate selezionato la branch main per errore, cambiare branch e selezionare l'opzione Bring my changes to dev in modo tale da portare gli aggiornamenti sulla branch dev senza perdere le modifiche.
Per contribuire controllare sempre che la cartella sia aggiornata con quanto salvato su GitHub premento sul tasto Fetch origin, dopodichè aggiornare il proprio o i propri file e salvare. A questo punto sull'applicazione GitHub desktop troverete la modifica al file con una preview della parte modificata, aggiunta o rimossa. Potrete quindi inviare il file inserendo almeno un titolo riepilogativo delle vostre modifiche e cliccando su Commit to dev. Cliccare in seguito su Push origin per inviare le modifiche su GitHub.
Ultimo aggiornamento del programma Agosto 2024