Programmazione LUMIFY WORK Angular 12

PERCHÉ STUDIARE QUESTO CORSO

Questo corso completo di programmazione Angular 12 è una combinazione di apprendimento teorico e laboratori pratici che include un'introduzione ad Angular, seguita da TypeScript, componenti, direttive, servizi, client HTTP, test e debug.
Il corso è ricco di informazioni utili e utilizzabili che puoi applicare immediatamente al tuo lavoro. Apprendi i fondamenti dello sviluppo di base di Angular 12 come applicazioni browser a pagina singola, reattive websiti e applicazioni mobili ibride.
Nota: Possiamo anche fornire formazione su altre versioni di Angular. Vi preghiamo di contattarci per fare una richiesta o registrare il vostro interesse.

COSA IMPARERAI
Dopo aver completato con successo questo corso, sarai in grado di:

• Sviluppa applicazioni Angular a pagina singola utilizzando Typescript
• Configura un ambiente di sviluppo angolare completo
• Crea componenti, direttive, servizi, pipe, moduli e validatori personalizzati
• Gestisci attività avanzate di recupero dei dati di rete utilizzando gli osservabili. Utilizza dati da REST web servizi utilizzando il client Angular HT TP Gestire le connessioni dati push utilizzando il file WebProtocollo socket
• Lavora con Angular Pipes per formattare i dati
• Utilizza le funzionalità avanzate di Angular Component Router
• Testa ed esegui il debug delle applicazioni Angular utilizzando gli strumenti integrati.

ARGOMENTI DEL CORSO

Capitolo 1. Introduzione ad Angular

• Che cos'è Angular?
• Caratteristiche centrali del framework Angular Casi d'uso appropriati
• Elementi costitutivi di un'applicazione Angular Architettura di base di un'applicazione Angular Installazione e utilizzo di Angular
• Anatomia di un'applicazione angolare che esegue l'applicazione
• Creazione e distribuzione dell'applicazione Angular per app mobili native
• Riepilogo

Capitolo 2. Introduzione a TypeScript

• Linguaggi di programmazione da utilizzare con la sintassi Angular TypeScript
• Redattori di programmazione
• Il sistema dei tipi: definizione delle variabili
• Il sistema dei tipi: definizione degli array
• Tipi primitivi di base
• Digitare Funzioni
• Inferenza di tipo
• Definizione delle classi
• Metodi di classe
• Controllo della visibilità
• Costruttori di classi
• Costruttori di classi – Campi non inizializzati in forma alternativa
• Interfacce
• Lavorare con i moduli ES6
• var contro let
• Funzioni freccia
• Stringhe del modello di sintassi compatto della funzione freccia
• I generici in classe
• Generici in funzione
• Riepilogo

Capitolo 3. Componenti

• Che cos'è un componente?
• Un Example Component
• Creazione di un componente utilizzando la CLI Angular
• La classe componente
• Il @Component Decorator
• Registrazione di un componente nel relativo modello di componente del modulo
• Example: modello HelloComponent
• Example: la classe HelloComponent che utilizza un componente
• Esegui l'applicazione
• Gerarchia dei componenti
• Il componente radice dell'applicazione
• Il Bootstrap File
• Hook del ciclo di vita dei componenti, ad esampgli Hook del ciclo di vita
• Stili CSS
• Riepilogo

Capitolo 4. Modelli di componenti

• Modelli
• Posizione del modello
• La sintassi dei baffi {{ }}
• Impostazione delle proprietà dell'elemento DOM
• Impostazione del testo del corpo dell'elemento
• Associazione di eventi
• Gestore eventi espressione
• Prevenire la gestione predefinita
• Direttive sugli attributi
• Applica stili modificando le classi CSS
• Exampfile: ngClass
• Applicazione diretta degli stili
• Direttive strutturali
• Modello di esecuzione condizionale
• Example: ngIf
• Looping utilizzando ngFor
• ngPer variabili locali
• Manipolazione della raccolta Esample – Eliminazione di un elemento
• Tracciamento degli articoli con ngFor Scambio di elementi con ngSwitch Raggruppamento di elementi
• Riepilogo delle variabili di riferimento del modello

Capitolo 5. Comunicazione tra componenti

• Nozioni di base sulla comunicazione
• L'architettura del flusso di dati
• Preparare il bambino a ricevere i dati
• Invia dati dal genitore
• Ulteriori informazioni sull'impostazione delle proprietà
• Evento di attivazione da un componente
• @Output() Esample – Componente figlio @Output() Esample – Componente principale
• Rilegatura bidirezionale completa
• Impostazione dell'associazione dati bidirezionale nel genitore
• Riepilogo

Capitolo 6. Moduli basati su modelli

• Moduli basati su modelli
• Modulo Importazione moduli
• Approccio di base
• Impostazione di un modulo
• Ottenere l'input dell'utente
• Omissione dell'attributo ngForm
• Inizializza il modulo
• Associazione dati bidirezionale
• Convalida del modulo
• Validatori angolari
• Visualizzazione dello stato di convalida utilizzando classi Tipi di input aggiuntivi
• Caselle di controllo
• Seleziona i campi (elenco a discesa).
• Opzioni di rendering per i campi Data Seleziona (elenco a discesa).
• Pulsanti di scelta
• Riepilogo

Capitolo 7. Forme reattive

• Forme reattive finiteview
• I mattoni
• Importa ReactiveFormsModule
• Costruisci un modulo
• Progetta il modello
• Ottenere valori di input
• Inizializzazione dei campi di input
• Impostazione dei valori del modulo
• Iscrizione alle modifiche di input
• Validazione
• Validatori integrati
• Visualizzazione dell'errore di convalida
• Validatore personalizzato
• Utilizzo di un validatore personalizzato
• Fornitura della configurazione al validatore personalizzato
• FormArray: aggiungi dinamicamente input
• FormArray: la classe del componente
• FormArray: il modello
• FormArray – Valori
• Sub FormGroups – Classe componente
• Gruppi di moduli secondari: modello HTML
• Perché utilizzare i gruppi di moduli secondari
• Riepilogo

Capitolo 8. Servizi e inserimento delle dipendenze

• Cos'è un servizio?
• Creazione di un servizio di base
• La classe di servizio
• Che cosa è l'iniezione di dipendenza?
• Iniezione di un'istanza del servizio
• iniettori
• Gerarchia degli iniettori
• Registrazione di un servizio con Root Injector
• Registrazione di un servizio con l'iniettore di un componente
• Registrare un servizio con un Feature Module Injector
• Dove registrare un servizio?
• Inserimento delle dipendenze in altri artefatti che forniscono un'implementazione alternativa dell'inserimento delle dipendenze e @Host
• Iniezione di dipendenze e @Optional
• Riepilogo

Capitolo 9. Client HTTP

• Il client Angular HT TP
• Utilizzo del client HT TP – Fineview
• Importazione di HttpClientModule
• Servizio che utilizza HttpClient
• Effettuare una richiesta GET
• Cosa fa un oggetto osservabile?
• Utilizzo del servizio in un componente
• Gestione degli errori del componente client PeopleService
• Personalizzazione dell'oggetto errore
• Effettuare una richiesta POST
• Effettuare una richiesta PUT
• Effettuare una richiesta di ELIMINAZIONE

Capitolo 10. Pipe e formattazione dei dati

• Cosa sono i tubi?
• Tubi incorporati
• Utilizzo delle pipe nel modello HTML Concatenamento delle pipe
• Pipe internazionalizzate (i18n) Caricamento dati locali
• La data del tubo
• Il numero Tubo
• Tubo di valuta
• Crea una pipa personalizzata
• Tubo personalizzato, esample
• Utilizzo di tubi personalizzati
• Utilizzando una pipe con ngFor
• Un tubo filtro
• Categoria Pipa: Pura e Impura
• Riepilogo
• Tubo puro esample
• Tubo impuro esample
• Riepilogo

Capitolo 11. Introduzione alle applicazioni a pagina singola

• Che cos'è un'applicazione a pagina singola (SPA) tradizionale Web Applicazione
• Flusso di lavoro della SPA
• Avanzamento applicazione a pagina singolatages API di cronologia HTML5
• Sfide termali
• Implementazione di SPA utilizzando il riepilogo angolare

Capitolo 12. Il router a componenti angolari

• Il router dei componenti
• View Navigazione
• L'API del router angolare
• Creazione di un'applicazione abilitata al router
• Ospitare i componenti instradati
• Navigazione tramite collegamenti e pulsanti
• Navigazione programmatica
• Passaggio dei parametri del percorso
• Navigazione con i parametri del percorso
• Ottenere i valori dei parametri del percorso
• Recupero del parametro di route in modo sincrono
• Recupero di un parametro di route in modo asincrono
• Parametri di query
• Fornitura di parametri di query
• Recupero dei parametri di query in modo asincrono
• Problemi con il manuale URL immissione e segnalibri
• Riepilogo

Capitolo 13. Client HTTP avanzato

• Richiedi opzioni
• Restituzione di un oggetto HttpResponse
• Impostazione delle intestazioni della richiesta
• Creazione di nuovi osservabili
• Creazione di un osservabile semplice
• Il metodo dei costruttori osservabili Operatori osservabili
• La mappa e gli operatori dei filtri
• L'operatore flatMap()
• L'operatore tap()
• Il combinatore zip()
• Memorizzazione nella cache della risposta HT TP
• Effettuare chiamate HT TP sequenziali
• Effettuare chiamate parallele
• Personalizzazione dell'oggetto errore con catchError()
• Errore nella pipeline
• Recupero errori
• Riepilogo

Capitolo 14. Moduli angolari

• Perché i moduli angolari?
• Anatomia di una classe di moduli
• Proprietà @NgModule
• Moduli di funzionalità
• Example Struttura del modulo
• Crea un modulo di dominio
• Creare una coppia di moduli instradati/instradati
• Creare un modulo di servizio
• Creazione di moduli comuni

Capitolo 15. Routing avanzato

• Modulo funzionalità abilitato al routing
• Utilizzo del modulo funzionalità
• Caricamento lento del modulo funzionalità
• Creazione di collegamenti per i componenti del modulo funzionalità
• Ulteriori informazioni sul caricamento lento
• Precaricamento dei moduli
• Percorso predefinito
• Percorso del percorso con caratteri jolly
• reindirizzare a
• Percorsi per bambini
• Definizione di percorsi secondari
• per i percorsi secondari
• Collegamenti per percorsi secondari
• Guardie di navigazione
• Creazione di implementazioni di guardia
• Utilizzo delle protezioni in un percorso
• Riepilogo

Capitolo 16. Unit test di applicazioni angolari

• Unit test sugli artefatti angolari
• Strumenti di test
• Passaggi tipici del test
• Risultati del test
• Suite di prova del gelsomino
• Specifiche del gelsomino (test unitari)
• Aspettative (Affermazioni)
• Corrispondenti
• Example di Utilizzo dei Matcher
• Utilizzando la proprietà not
• Installazione e smontaggio nelle suite di test unitari
• Example delle funzioni beforeEach e afterEach
• Modulo Test Angolare
• Example Modulo Test Angolare
• Testare un servizio
• Iniezione di un'istanza del servizio
• Testare un metodo sincrono
• Testare un metodo asincrono
• Utilizzo del client HT TP simulato
• Fornire una risposta predefinita
• Testare un componente
• Modulo di test dei componenti
• Creazione di un'istanza del componente
• La classe ComponentFixture
• Test dei componenti di base
• La classe DebugElement
• Simulazione dell'interazione dell'utente
• Riepilogo

Capitolo 17. Debug

• Sopraview del debug angolare
• Viewinserendo il codice TypeScript nel debugger
• Utilizzando la parola chiave del debugger
• Registrazione di debug
• Cos'è Angular DevTools?
• Utilizzo di Angular DevTools
• Angular DevTools – Struttura dei componenti
• Angular DevTools – Esecuzione del rilevamento delle modifiche
• Rilevamento degli errori di sintassi
• Riepilogo

Esercizi di laboratorio

• Laboratorio 1. Introduzione ad Angular
• Laboratorio 2. Introduzione a TypeScript
• Laboratorio 3. Introduzione ai componenti
• Laboratorio 4. Modello componente
• Laboratorio 5. Creare un componente Galleria fotografica
• Laboratorio 6. Modulo basato su modelli
• Lab 7. Creare un modulo di modifica
• Laboratorio 8. Forma reattiva
• Laboratorio 9. Sviluppare un servizio
• Laboratorio 10. Sviluppare un client HT TP
• Laboratorio 11. Utilizzare i tubi
• Lab 12. Applicazione di base a pagina singola utilizzando il router Lab 13. Creazione di un'applicazione a pagina singola (SPA)
• Laboratorio 14. Client HT TP avanzato
• Laboratorio 15. Utilizzo del Bootstrap angolare
• Laboratorio 16. Caricamento lento dei moduli
• Laboratorio 17. Routing avanzato
• Laboratorio 18. Test unitari
• Laboratorio 19. Debug di applicazioni angolari

A CHI E' RIVOLTO IL CORSO?
Questo corso è rivolto a chiunque abbia bisogno di apprendere i fondamenti dello sviluppo di Angular 12 e applicarli alla creazione web applicazioni subito. Possiamo anche offrire e personalizzare questo corso di formazione per gruppi più grandi, facendo risparmiare tempo, denaro e risorse alla vostra organizzazione.

PREREQUISITI
Web per ottenere il massimo da questo corso Angular è richiesta esperienza di sviluppo utilizzando HTML, CSS e JavaScript. Utile anche la conoscenza del DOM del browser. Non è richiesta una precedente esperienza di Angular, con AngularJS o qualsiasi versione di Angular.
https://www.lumifywork.com/en-au/courses/angular-12-programming/

Documenti / Risorse

Programmazione LUMIFY WORK Angular 12 [pdf] Guida utente Angular 12 Programmazione, Angular, 12 Programmazione, Programmazione

Riferimenti

• Manuale d'uso