Durata corso:
Termine iscrizioni:
Inizio corso:
Costo:
Luogo:
State Manager & Data Architectures con Angular e Ngrx
Codice: DSW07
Creare applicazioni Angular scalabili, testabili e semplici da mantenere utilizzando NGRX per la
gestione dello stato applicativo, applicando una netta separazione tra architettura dati e presentational
layer.
Modalità di erogazione
In aula o Live Virtual Classroom
Attestato di partecipazione
Al termine del corso verrà rilasciato l’attestato di frequenza
Esame
Redux fundamentals
- Principi fondamentali di Redux
- Immutable State in Javascript
- Pure vs Inpure functions
- Redux core concepts: store, reducers, actions
NGRX fundamentals
- Introduzione tecnica alla libreria
- Costrutti, funzionalità e API principali
- Installare le librerie necessarie
- Reactive Store e Observable
- Modellare lo store con StoreModule
- Modificare lo stato tramite reducer
- Selectors e memoization: selezionare porzioni di stato
- Debugging e Redux Chrome Dev tools
- Esempi e casi d'uso reali
Impostare progetti NGRX
- Organizzazione progetti scalabili e manutenibili in Angular
- Data architectures in Angular e NGRX
- Sviluppo modulare: custom ngModules Core, Shared e Features
- Approccio component-based
- Stateless architectures
- Containers vs Presentational components
- Sviluppo Real World Applications in ANGULAR / NGRX: gestione CRUD, autenticazione,
profilo, forms complessi, protezione DOM, router e molto altro
Autenticazione, Sicurezza e NGRX
- Processo di autenticazione JWT
- Modifica profilo utente
- Router Guards: creare sezioni protette da login
- HTTP Interceptors
- Protezione del DOM tramite custom structural directives, ad es. *ifLogged
- AutoLogin e persistenza dati tramite localStorage
Reducer & Selectors
- Stato globale con forRoot
- Gestione stato "lazy" tramite l'utilizzo di forFeature
- Modifica dello stato tramite reducer
- Il metodo createReducer in NGRX
- Nested reducers con ActionReducerMap
- Selectors semplici e compositi
- createSelector vs createFeatureSelector
- MetaReducers
Actions & Effects
- Time travel debugging
- Typed Safed Actions con createAction
- Il metodo createAction
- Gestione side effects con "NGRX Effects"
- Il metodo createEffect
- Gestione applicazioni CRUD, router e localStorage
- Avviare azioni multiple negli effects
- Effetti condizionali sulla base dello store
Router Store
- Installazione e configurazione NGRX Router
- Sincronizzazione router con stato applicativo
- Navigazione
- Creazione custom Actions per il router
- Router Selectors
- Protezione route con guardie, NGRX e l'utilizzo di JWT
- Gestione router con Lazy Loading
Reactive Forms, UI & NGRX
- Integrazione Reactive Forms
- Sincronizzazione Form con lo stato applicativo
- Utilizzo di FormBuilder, FormControl, FormGroup
- Gestione elenchi dati con FormArray
- Gestione User Interface tramite NGRX (ad es. apertura e gestione pannelli)
Sviluppatori
Per comprendere gli argomenti trattati nel corso è necessario avere una buona conoscenza delle
seguenti funzionalità del framework Angular: componenti custom, moduli, dependency injection, router
e lazy loading.
Pur essendo un argomento affrontato durante il corso, data la sua complessità, consiglio inoltre di
documentarsi sul concetto di programmazione reattiva e in particolar modo sulla libreria RxJS e
l'utilizzo dei suoi operatori.
Nel caso interessasse approfondire questa tematica, guarda il programma del corso Angular & RxJS
Al termine del corso il partecipante sarà, quindi, in grado di introdurre NGRX nei propri progetti Angular
e di sfruttarne al massimo il potenziale.