Angular e Reactive Forms Fundamentals
I form rappresentano buona parte delle funzionalità incluse in applicazioni web enterprise e corporate (B2B, banche, fintech, scuole, PA, assicurazioni ma anche in CRM, CMS…) e sono, spesso, la parte più complessa, lunga e noiosa da gestire. Ma dopo l’uscita di AngularJS, e poi Angular (2+), le cose sono cambiate 😎.
Angular è il framework front-end che integra il maggior numero di funzionalità per la gestione di form, dividendoli in due tipologie, "template-driven form", totalmente basati sui template HTML, e i "Reactive Forms", basati sul concetto di Observable tramite l’utilizzo della libreria RxJS.
Il corso
In questo corso intensivo ci focalizzeremo su RxJS e le API dei Reactive Forms forniti dal framework, in quanto offrono una flessibilità decisamente superiore rispetto ai template-driven forms, ed esploreremo diverse tecniche per sfruttarli al meglio con esempi pratici e casi d’uso reali: dalle fondamenta fino ai casi più complessi.
Se vuoi saperne di più, ti consiglio di visitare la pagina ufficiale del corso disponibile sul mio sito web.
Angular 15 & RxJS 7
Apprendere le basi del paradigma funzionale reattivo con e sfruttarne il potenziale in Angular e, in particolar modo, con i form reattivi
Typed Reactive Forms
Scoprire le funzionalità fondamentali per la gestione dei form reattivi in Angular e affrontare scenari e casi d'uso frequenti
Angular Material
Metti in pratica i concetti creando Reactive Form con Angular Material
Il programma
- 01. Introduzione a RxJS (15:39)
- 02. HTML Native Events in Typescript (2:11)
- 03. From Vanilla JavaScript to RxJS (2:12)
- 04. Pipeable RxJS operators (3:46)
- 05. Creare un progetto Angular 15 (2:00)
- 06. Angular, @ViewChild, Component LifeCycle & Input Text (3:29)
- 07. TypeScript Strict Mode, Optional Chaining & Non-Null Assertion Operators (5:04)
- 08. Creare Form reattivi in Angular con l'operatore fromEvent (2:21)
- 09. FormControl - Il mio primo Reactive Form (3:22)
- 10. RxJs Operators: work with data, debounceTime, distinct & distinctUntilChanged (6:07)
- 11. REST API, HttpClient & Reactive Forms (2:18)
- 12. Bad Practice: evitare subscribe all'interno di altre subscribe (3:32)
- 13. Flattening Operators: esempio con mergeMap (1:56)
- 14. Gestione errori in RxJS 7 (5:45)
- 15. Typing (2:35)
- 16. Display Data (5:08)
- 17. Pipe Async e richieste HTTP multiple (4:59)
- 18. Considerazioni Finali (1:49)
- 19. Dependency Injection (DI), Services e Reactive Forms (1:55)
- Capitolo 1: QUIZ
- 01. Form Control & initial values (1:38)
- 02. Typed Forms: default value, nonNullable & reset (1:55)
- 03. setValue and type forms (1:17)
- 04. dirty, touched and FormControls properties (1:43)
- 05. Validators (3:11)
- 06. Pattern Validators con regular expression (0:52)
- 07. Messaggi di errori personalizzati (7:01)
- 08. Creare animazioni sulla base messaggi di errore (6:27)
- 09. creare il component "error-bar" (3:56)
- 10. Creare un componente riutilizzabile per visualizzazione errori (2:16)
- 11. Performance e creazione Custom Pipe (3:29)
- 12. Utilizzo di Generics & Custom Types con i FormControl (2:53)
- Capitolo 2: QUIZ
- 01. Create a Form with multiple Form Control elements (2:31)
- 02. Typed Form Group (6:44)
- 03. Type Form, setValue and patchValue (1:51)
- 04. Typed Form Builder e proprietà nonNullable (2:29)
- 05. FormBuilder, valueChanges e mergeMap (2:24)
- 06. La proprietà updateOn (1:28)
- 07. La funzione "get"per recuperare le istanze dei FormControl (2:22)
- 08. Disabilitare FormControl a runtime, value vs getRawValue (5:06)
- 09. Migliorare la UI utilizzando un framework (2:06)
- 10. Custom Form control errors (5:06)
- 11. RegEx e "pattern" Validator (1:38)
- 12. Custom Validator (3:16)
- 13. Reactive Forms & custom ngModules (3:17)
- 14. Reactive Forms e "Standalone" components (2:19)
- 15. Button type: submit and button (2:32)
- 16. Form Group, Custom Type & Generics (2:01)
- Capitolo 3: QUIZ
