LUMIFY WORK Angular 15 programmeringshandbok

ANSÖKAN OCH WEB UTVECKLING
Angular 15 programmering
LÄNGD 5 dagar
VERSION 15

VARFÖR STUDERA DENNA KURS

Denna intensiva och omfattande Angular 15-utbildning ger deltagarna färdigheter som de kan använda direkt i sitt arbete. Du kommer att lära dig grunderna i Angular 15-utveckling, såsom webbläsarapplikationer på en sida, responsiv webwebbplatser och hybridmobilapplikationer.
Den här kursen är en kombination av teoretiskt lärande och praktiska laborationer som inkluderar en introduktion till Angular, följt av TypeScript, komponenter, direkt iv, tjänster, HTTPClient, testning och felsökning.
Notera: Vi kan även ge utbildning i andra versioner av Angular. Kontakta oss gärna för att göra en förfrågan eller anmäla ditt intresse.

ANGULAR PÅ LUMIFY ARBETE

VAD DU LÄRER

Efter framgångsrik genomgång av denna kurs kommer du att ha kunskapen att:

• Utveckla ensidig vinkelapplikation med Typescript
• Skapa en komplett Angular utvecklingsmiljö
• Skapa komponenter, direktioner, tjänster, rör, formulär och anpassade validerare
• Hantera avancerade uppgifter för hämtning av nätverksdata med hjälp av Observables
• Konsumera data från REST web tjänster som använder Angular HTTP-klienten
• Hantera push-data-anslutningar med hjälp av WebSocket protokoll
• Arbeta med Angular Pipes för att formatera data
• Använd avancerade Angular Component Router-funktioner
• Testa och felsöka Angular applikationer med inbyggda verktyg
• Arbeta med Angular CLI

Min instruktör var fantastisk att kunna sätta scenarier i verkliga instanser som relaterade till min specifika situation.
Jag fick känna mig välkommen från det ögonblick jag kom och förmågan att sitta som grupp utanför klassrummet för att diskutera våra situationer och våra mål var oerhört värdefull.
Jag lärde mig mycket och kände att det var viktigt att mina mål med att gå den här kursen uppfylldes.
Bra jobbat Lumify Work-team.AMANDA NICOL
IT SUPPORT SERVICES MANAGER – HEALTH WORLD LIMITED

KURSÄMNEN

1. Vi presenterar Angular
   • Vad är Angular?
   • Centrala egenskaper hos Angular Framework
   • Lämpliga användningsfall
   • Byggstenar för en vinkelapplikation
   • Grundläggande arkitektur för en vinkelapplikation
   • Installera och använda Angular
   • Anatomi hos en vinkelapplikation
   • Köra applikationen
   • Bygga och distribuera applikationen
   • Angular för inbyggda mobilappar
2. Introduktion till TypeScript
   • Programmeringsspråk för användning med Angular
   • TypeScript-syntax
   • Programmeringsredigerare
   • Typsystemet – Definiera variabler
   • Typsystemet – Definiera arrayer
   • Grundläggande primitiva typer
   • Skriv in Funktioner
   • Skriv inferens
   • Definiera klasser
   • Klassmetoder
   • Siktkontroll
   • Klasskonstruktörer
   • Klasskonstruktörer – alternativ form
   • Oinitierade fält
   • Gränssnitt
   • Arbeta med ES6-moduler
   • var vs let
   • Pilfunktioner
   • Pilfunktion Kompakt syntax
   • Mallsträngar
   • Generika i klassen
   • Generika i funktion
3. Komponenter
   • Vad är en komponent?
   • Ett example Komponent
   • Skapa en komponent med Angular CLI
   • Komponentklassen
   • @Component-dekoratören
   • Registrera en komponent till dess modul
   • Komponentmall
   • Example: HelloComponent-mall
   • Example: HelloComponent-klassen
   • Använda en komponent
   • Kör programmet
   • Komponenthierarki
   • Applikationsrotkomponenten
   • Bootstrap File
   • Komponentlivscykelkrokar
   • Example Livscykelkrokar
   • CSS-stilar
4. Komponentmallar
   • Mallar
   • Mallplats
   • Mustaschen {{ }}-syntax
   • Ställa in DOM-elementegenskaper
   • Ställa in elementets brödtext
   • Händelsebindning
   • Uttryckshändelsehanterare
   • Förhindra standardhantering
   • Attributdirektiv
   • Använd stilar genom att ändra CSS-klasser
   • Example: ngKlass
   • Tillämpa stilar direkt
   • Strukturdirektiv
   • Villkorligt exekvera mall
   • Example: ngIf
   • Looping med ngFor
   • ngFör lokala variabler
   • Manipulera samlingen
   • Example – Ta bort ett objekt
   • Objektspårning med ngFor
   • Byta element med ngSwitch
   • Gruppera element
   • Mallreferensvariabel
5. Kommunikation mellan komponenter
   • Grundläggande kommunikation
   • Dataflödesarkitekturen
   • Förbereda barnet för att ta emot data
   • Skicka data från förälder
   • Mer om inställning av egenskaper
   • Utlösningshändelse från en komponent
   • @Output() Example – Barnkomponent
   • @Output() Example – Föräldrakomponent
   • Full tvåvägsbindning
   • Ställa in tvåvägsdatabindning i överordnad
6. Mall och drivna formulär
   • Malldrivna formulär
   • Importera formulärmodul
   • Grundläggande tillvägagångssätt
   • Skapa ett formulär
   • Få användarinmatning
   • Utelämna ngForm-attribut
   • Initiera formuläret
   • Tvåvägs databindning
   • Formulärvalidering
   • Vinkelvaliderare
   • Visar valideringstillstånd med hjälp av klasser
   • Ytterligare ingångstyper
   • Kryssrutor
   • Välj (rullgardinsmenyn) fält
   • Återgivningsalternativ för val (rullgardinsmeny)
   • Datumfält
   • Radioknappar
7. Reaktiva formulär
   • Reaktiva formulär överview
   • Byggstenarna
   • Importera Reactive FormsModule
   • Konstruera ett formulär
   • Designa mallen
   • Hämta inmatningsvärden
   • Initiera inmatningsfälten
   • Ställa in formulärvärden
   • Prenumerera på Input Changes
   • Validering
   • Inbyggda validatorer
   • Visar valideringsfel
   • Custom Validator
   • Använda en anpassad validator
   • Levererar konfiguration till Custom Validator
   • FormArray – Lägg till indata dynamiskt
   • FormArray – Komponentklassen
   • FormArray – Mallen
   • FormArray – Värden
   • Sub FormGroups – Komponentklass
   • Sub FormGroups – HTML-mall
   • Varför använda Sub FormGroups
8. Tjänster och beroendeinjektion
   • Vad är en tjänst?
   • Skapa en bastjänst
   • Serviceklassen
   • Vad är Dependency Injection?
   • Injicera en tjänsteinstans
   • Injektorer
   • Injektorhierarki
   • Registrera en tjänst med rotinjektorn
   • Registrera en tjänst med en komponents injektor
   • Registrera en tjänst med en funktionsmodulinjektor
   • Var registrerar jag en tjänst?
   • Beroendeinjektion i andra artefakter
   • Tillhandahålla en alternativ implementering
   • Dependency Injection och @Host
   • Dependency Injection och @Optional
9. HTTP-klient
   • Angular HTTP-klienten
   • Använda HTTP-klienten – Överview
   • Importera HttpClientModule
   • Tjänst som använder HttpClient
   • Göra en GET-förfrågan
   • Vad gör ett observerbart objekt?
   • Använda tjänsten i en komponent
   • PeopleService-klientkomponenten
   • Felhantering
   • Anpassa felobjektet
   • Göra en POST-förfrågan
   • Göra en PUT-förfrågan
   • Göra en DELETE-förfrågan
10. Rör och dataformatering
    • Vad är rör?
    • Inbyggda rör
    • Använda Pipes i HTML-mall
    • Kedjerör
    • Internationella rör (i18n)
    • Laddar lokaldata
    • Datumet Pipe
    • Siffran Pipe
    • Valutarör
    • Skapa ett anpassat rör
    • Custom Pipe Example
    • Använda anpassade rör
    • Använda ett rör med ngFor
    • Ett filterrör
    • Rörkategori: Rent och orent
    • Pure Pipe Example
    • Orent rör Example
11. Introduktion till ensidiga applikationer
    • Vad är en Single Page Application (SPA)
    • Traditionell Web Ansökan
    • SPA Workflow
    • Single Page Application Advantages
    • HTML5 History API
    • SPA-utmaningar
    • Implementera SPA med Angular
12. Angular Component Router
    • Komponentroutern
    • View Navigering
    • Angular Router API
    • Skapa en routeraktiverad applikation
    • Värd för de dirigerade komponenterna
    • Navigering med länkar och knappar
    • Programmatisk navigering
    • Passerande ruttparametrar
    • Navigera med ruttparametrar
    • Hämta ruttparametervärden
    • Hämta ruttparametern synkront
    • Hämta en ruttparameter asynkront
    • Fråga parametrar
    • Ange frågeparametrar
    • Hämta frågeparametrar asynkront
    • Problem med manual URL inträde och bokmärke
13. Avancerad HTTP-klient
    • Begäralternativ
    • Returnera ett HttpResponse-objekt
    • Ställa in förfrågningsrubriker
    • Skapa nya observerbara objekt
    • Skapa en enkel observerbar
    • Den observerbara konstruktörsmetoden
    • Observerbara operatörer
    • Kartan och filtret Operatörer
    • Operatören flatMap()
    • Tap()-operatören
    • Zip()-kombinatorn
    • Cachning av HTTP-svar
    • Göra sekventiella HTTP-samtal
    • Ringa parallella samtal
    • Anpassa felobjekt med catchError()
    • Fel i pipeline
    • Felåterställning
14. Vinkelmoduler
    • Varför vinkelmoduler?
    • Anatomi av en modulklass
    • @NgModule-egenskaper
    • Funktionsmoduler
    • Example Modulstruktur
    • Skapa en domänmodul
    • Skapa ett rutt-/dirigeringsmodulpar
    • Skapa en servicemodul
    • Skapa gemensamma moduler
    • Använda en modul från en annan
15. Avancerad routing
    • Routing-aktiverad funktionsmodul
    • Använda funktionsmodulen
    • Lata laddar funktionsmodulen
    • Skapa länkar för funktionsmodulens komponenter
    • Mer om Lazy Loading
    • Förladdningsmoduler
    • routerLinkActive-bindning
    • Standardrutt
    • Ruttväg med jokertecken
    • omdirigera till
    • Barnvägar
    • Definiera barnrutter för barnrutter
    • Länkar för barnvägar
    • Navigationsvakter
    • Skapa vaktimplementeringar
    • Använda vakter i en rutt
16. Enhetstestning av vinkelapplikationer
    • Enhetstestning av vinkelartefakter
    • Testverktyg
    • Typiska teststeg
    • Testresultat
    • Jasmine Test Suites
    • Jasmine-specifikationer (enhetstester)
    • Förväntningar (påstående joner)
    • Matchare
    • Examples om att använda matchare
    • Använda inte egenskapen
    • Installation och rivning i enhetstestsviter
    • Example av beforeEach och afterEach Funktioner
    • Vinkeltestmodul
    • Example Vinkeltestmodul
    • Testa en tjänst
    • Injicera en tjänsteinstans
    • Testa en synkron metod
    • Testa en asynkron metod
    • Använda Mock HTTP-klient
    • Tillhandahållande av konserverad respons
    • Testa en komponent
    • Komponenttestmodul
    • Skapa en komponentinstans
    • ComponentFixture Class
    • Grundläggande komponenttester
    • Klassen DebugElement
    • Simulering av användarinteraktion
17. Felsökning
    • Överview av Angular Debugging
    • Viewing TypeScript Code i Debugger
    • Använda felsökaren Keyword
    • Felsökningsloggning
    • Vad är Angular DevTools?
    • Använda Angular DevTools
    • Angular DevTools – Komponentstruktur
    • Angular DevTools – Ändra detektionsjonexekvering
    • Fånga syntaxfel

VEM ÄR KURSEN FÖR?

Den här kursen vänder sig till alla som behöver lära sig grunderna i Angular 15-utveckling och tillämpa den direkt för att skapa web applikationer.
Vi kan också leverera och anpassa denna utbildning för större grupper – vilket sparar tid, pengar och resurser för din organisation. För mer information, vänligen kontakta oss via e-post på ph.training@lumifywork.com

FÖRUTSÄTTNINGAR

• Web utvecklingserfarenhet med HTML, CSS och JavaScript krävs för att få ut det mesta av denna Angular-kurs
• Kunskaper om webbläsarens DOM är också användbart
• Ingen tidigare erfarenhet av Angular eller AngularJS krävs

Utbudet av denna kurs av Lumify Work styrs av bokningsvillkoren.
Vänligen läs villkoren noggrant innan du anmäler dig till denna kurs, eftersom anmälan till kursen är villkorad av att du accepterar dessa villkor.

https://www.lumifywork.com/en-ph/courses/angular-15-programming/ ph.training@lumifywork.com
lumifywork.com
facebook.com/LumifyWorkPh
linkedin.com/company/lumify-work-ph
twitter.com/LumifyWorkPH
youtube.com/@lumifywork