Angular opplæring - eLearning

Kursplan

1. Single Page-applikasjoner

   Leksjon 01

   - Kursoversikt

   - Introduksjon til enkeltsideapplikasjoner (SPA)

   - Hva trenger vi Angular til

   - Sette opp utviklingsmiljøet

   - Arkitektur for Angular-applikasjoner

   - Første Angular-applikasjon

2. TypeScript og ESNext

   Leksjon 02

   - Modulintroduksjon og introduksjon til TypeScript

   - Sette opp miljøet for å skrive TypeScript

   - Variabeldeklarasjoner (var, let og const)

   - Typer - Primitive typer

   - Typer - Referanse- og spesialtyper

   - Operatorer - Spread og Backticks

   - Operatorer - Destrukturering og Rest

   - Klasser

   - Grensesnitt

   - Pilefunksjoner

   - Moduler

   - Hent

   - Asynkron eller vent

3. Dekoratører

   Leksjon 03

   - Modulintroduksjon og en oversikt over Angular-moduler

   - Hva er dekoratører

   - Angular-moduler og @NgModule-dekoratøren

   - Erklæringer

   - Import og Eksport

   - Leverandører, oppstartskomponenter og inngangskomponenter

   - Oppstartsmekanisme for Angular-applikasjon

4. Komponentdekoratør

   Leksjon 04

   - Modulintroduksjon

   - Angular-komponenter og @Component-dekoratøren

   - Opprette en Angular-komponent ved hjelp av Angular CLI og på StackBlitz

   - Komponentdekoratør Metadata

   - Visningsinnkapsling - Emulert, ShadowDom, Ingen

   - Datainnbinding - Strenginterpolasjon

   - Egenskapsbinding

   - Hendelsesbinding

   - @Input og @Output egenskapsdekoratører

   - Tosidig databinding

   - Attributtilknytning

   - Klassebinding

   - Klassebinding

   - Introduksjon til livssykluskroker i Angular

   - Bruke livssykluskroker i Angular

   - Vis forespørsler - Vis barn, Vis barna, Innholdsbarn, Innholdsbarna

   - Endre deteksjonsmekanismen i Angular. ZoneJS, NgZones

5. Angular-ruting

   Leksjon 05

   - Innføring i ruting

   - Implementering av ruting i en Angular-applikasjon

   - Opprette en brukerliste. Klargjør for barn-routing

   - Abstrahere brukerlenken til en separat komponent

   - Implementering av barneruter

   - Samsvarende sti og rutetyper

   - Introduksjon til rutevakter i Angular

   - CanActivate og CanActivateChild Guards i Angular

   - CanDeactivate Guard i Angular

   - Forhåndshenting av data for en komponent ved bruk av Resolve

6. Avhengighetsinjeksjon

   Leksjon 06

   - Innledning til seksjon

   - DI som et mønster, DI som et rammeverk, og typer tilbydere

   - Hierarkisk avhengighetsinjeksjon

   - Introduksjon til tjenester i Angular

   - Hent data fra et Rest API ved bruk av HttpClient

   - CRUD-operasjoner ved bruk av HttpClient, HttpParams og HttpHeaders

   - Observables og Operatorer i Observables - Map, Retry, Catch

   - BehaviorSubject og deling av data ved bruk av BehaviorSubjects

7. Dypdykk i direktiver

   Leksjon 07

   - Innledning til seksjon

   - Innføring i direktiver

   - Innebygde strukturelle direktiver

   - Innebygde attributtdirektiver

   - Bygge egendefinerte attributtdirektiver

   - Bygge egendefinerte strukturelle direktiver

   - Introduksjon til rør i Angular

   - Bruk av innebygde rør

   - Lage egendefinerte rør i Angular

   - Rene og urene pipes i Angular

   - Dekoratører gjennomgått

   - Bygge egendefinerte dekoratører i Angular

   - Bygge en tilpasset livssykluskrok klasse logger dekoratør

   - Bygge egendefinert egenskapsdekoratør i Angular

8. Skjemaer i Angular

   Leksjon 08

   - Innledning til seksjon

   - Typer strategier for skjemabygging i Angular

   - Opprette lange Bootstrap-skjemaer raskt ved hjelp av VS Code og Emmet

   - Legge til FormControl(s) i et skjemastyrt skjema ved bruk av ngModel-direktivet

   - Å få JavaScript-objektrepresentasjonen av et skjema ved bruk av ngForm-direktivet

   - Deaktivering av send-knappen på et skjema ved bruk av skjemaets $invalid-flagg

   - Å få JavaScript-objektrepresentasjonen av et skjema i TypeScript-klassen

   - Legge til avmerkingsboks, radioknapper og rullegardinliste i ditt malstyrte skjema

   - Opprette underseksjoner i skjemaet ved bruk av NgModelGroup-direktivet

   - Trinn for å implementere et reaktivt skjema i Angular

   - Raskt opprette et Bootstrap-skjema for vårt reaktive skjema ved hjelp av Emmet

   - Opprette et reaktivt skjema i TypeScript-klassen og koble det til malen

   - Legge til validering i et reaktivt skjema

   - Dynamisk legge til eller fjerne FormControl(s) eller FormGroup(s) ved bruk av FormArray(s)

   - Legge til synkrone egendefinerte valideringer i ditt reaktive skjema

   - Legge til asynkrone egendefinerte valideringer i ditt reaktive skjema

   - Tilbakestille verdien av et skjema

9. Bruke tredjepartsbiblioteker

   Leksjon 09

   - Innledning til seksjonen

   - Opprette et Angular CLI-prosjekt med SCSS som basestil

   - Introduksjon av Material Design Bootstrap i ditt Angular CLI-prosjekt

   - Legge til en navigasjonslinje i toppteksten din

   - Legger til Material Design-knapper

   - Legge til kort

   - Bruk av Material Design-rullegardinlister og skjemainndata

   - Introduksjon av Angular Material i ditt Angular CLI-prosjekt på toppen av MDB

   - Legge til radioknapper, glidebryter, skyveknapp, fremdriftslinje og spinner

   - Introduksjon til Firebase

   - Lage en app ved å bruke Firebase-konsollen

   - Konfigurere ditt Angular CLI-prosjekt for å støtte Firebase

   - Interaksjon med Firebase Realtime Database ved bruk av metoder på AngularFireList

   - Legge til og lese data fra sanntidsdatabasen i Firebase

   - Oppdatering og sletting av data fra sanntidsdatabasen i Firebase