Il corso descrive le tecniche fondamentali necessarie per progettare e sviluppare applicazioni JavaScript dalle basi agli argomenti più avanzati del linguaggio.
Il corso è destinato a studenti che desiderano apprendere le basi per lo sviluppo di applicazioni JavaScript.
Lo studente ideale del corso ha già una buona conoscenza su html/css e delle competenze di base sul pensiero computazionale e coding.
Al termine del corso il partecipante sarà in grado di:
- Creare applicazioni front-end con JavaScript
- Utilizzare le funzionalità JavaScript moderne e all'avanguardia, utilizzando un flusso di lavoro moderno (Babel e Webpack)
- Consumare web API per recuperare ed integrare sulle proprie applicazioni dati di terze parti
- Utilizzare la programmazione orientata agli oggetti con JavaScript e lavorare con Prototype e Class
- Creare componenti funzionali di interfaccia utente come popup, menu a discesa, etc
Basi di JavaScript
- Introduzione a JavaScript
- Impostare l'ambiente di sviluppo
- La console del browser
- Variabili, costanti e tipi di dato
- Il tipo String ed i suoi principali metodi
- Il tipo Numbers
- Template String
- Array
- Null e undefined
- Boolean e confronto, confronto loose e strict
- Conversioni tra i tipi
Controllo di flusso
- Cosa si intende per controllo di flusso
- Ciclo for
- Ciclo while e do while
- Istruzione if, else ed else if
- Operatori logici
- Break e continue
- Istruzione Switch
- Ambito delle variabili
Funzioni e metodi
- Come dichiarare una funzione
- Parametri ed argomenti
- Valore di ritorno
- Arrow function
- Differenza tra metodi e funzioni
- Metodo foreach
- Funzioni callback
Oggetti
- Creare un oggetto
- Aggiungere dei metodi ad un oggetto
- La keyword 'this'
- Oggetti all'interno di array
- L'oggetto Math
- Tipi riferimento e primitivi
Il Document Object Model (DOM)
- Cos'è
- Interagire con il browser
- Il query selector
- Altri modi per interrogare il DOM
- Aggiungere e modificare i contenuti di una pagina
- Recuperare ed impostare degli attributi
- Modificare gli stili css, l'oggetto style
- Aggiungere e rimuovere delle classi
- Parents, Children e Siblings
Gli Eventi
- Cosa sono
- Basi sugli eventi
- Eventi DOM
- Realizzare un popup
- Eventi dentro i form
- Espressioni regolari (RegEx)
- Testare i pattern RegEx
- Validazione dei form di base
- Eventi di tastiera
Metodi degli array
- Metodo filter
- Metodo map
- Metodo reduce
- Metodo find
- Metodo sort
- Concatenare i metodi
Lavorare con la data e l'ora
- Data e ora in JavaScript
- Comparazione tra date
- Libreria date-fns
JavaScript Async
- Cosa si intende per Async JavaScript
- Come effettuare delle richieste HTTP
- Response
- Funzioni callback
- Dati in formato JSON
- L'inferno delle Callback
- Promise
- Concatenare le Promise
- L'API Fetch
- Keywords Async e Await
- Gestione e generazione degli errori
Local storage
- Introduzione al Local storage
- Memorizzare e leggere dati
- Rimuovere i dati dallo storage
- Parsing dei dati
JavaScript orientato agli oggetti
- Introduzione alla programmazione orientata agli oggetti
- Classi
- I costruttori di una classe
- I metodi e concatenamento dei metodi
- Ereditarietà
- Prototype Model
- Ereditarietà da Prototype
- Oggetti già disponibili in JavaScript
Firebase
- Firebase e Firestore
- Connettersi a Firestore
- Recuperare delle collections
- Memorizzare dei documenti
- Cancellare dei documenti
- Real-time listeners
- Unsubscribing
Ulteriori funzionalità ES6
- Spread e Rest
- Sets
- Symbols
Babel e Webpack
- Supporto delle funzionalità moderne su tutti i browser
- Introduzione a Babel
- Installare Node.js e Babel
- Utilizzare la CLI di Babel
- Introduzione a Webpack
- Impostare un file Webpack
- Utilizzare la CLI di Webpack
- Introduzione ai moduli
- Esportazione di default
- Il server di sviluppo webpack
- Modalità di produzione e di sviluppo
- Utilizzare insieme Babel e Webpack
- Slide docente
- Bloc notes e penna
- Attestato di fine corso
Gli sviluppatori che frequentano questo corso dovrebbero aver già acquisito delle competenze relative a:
- Html
- Css
- Nozioni di base di programmazione
