Course Outline
Invoering
- Wat is Angular?
- Angular versus React versus Vue
- Overzicht van Angular 17 kenmerken en architectuur
- Het opzetten van de ontwikkelomgeving
Aan de slag
- Een nieuw Angular 17-project maken met behulp van Angular CLI
- Het verkennen van de projectstructuur en bestanden
- Het uitvoeren en bedienen van de applicatie
- Gegevens weergeven met behulp van interpolatie en expressies
Componenten
- De rol van componenten begrijpen in Angular 17
- Componenten maken en gebruiken
- Gegevens doorgeven tussen componenten met behulp van in- en uitgangen
- Gebruik maken van levenscyclushaken voor componenten
Richtlijnen
- Het verschil begrijpen tussen structurele richtlijnen en attribuutrichtlijnen
- Ingebouwde richtlijnen maken en gebruiken, zoals ngIf, ngFor, ngSwitch, enz.
- Aangepaste richtlijnen maken en gebruiken
Pijpen
- Het doel van pijpen begrijpen in Angular 17
- Ingebouwde leidingen maken en gebruiken, zoals datum, valuta, json, enz.
- Aangepaste pijpen maken en gebruiken
Diensten
- Inzicht in de rol van diensten in Angular 17
- Diensten maken en gebruiken
- Afhankelijkheden injecteren met behulp van providers
Modules
- De rol van modules begrijpen in Angular 17
- Modules maken en gebruiken
- Modules importeren en exporteren
Dataverbinding
- Het verschil begrijpen tussen eenrichtings- en tweerichtingsgegevensbinding
- Maken en gebruiken van eigenschapsbinding, gebeurtenisbinding en banaan-in-een-box-syntaxis
- Sjabloonreferentievariabelen gebruiken
Routering
- De rol van routing begrijpen in Angular 17
- Routes maken en configureren
- Navigeren tussen routes met routerLink en router.navigate()
- Routeparameters, queryparameters en fragmenten gebruiken
Formulieren
- Het verschil begrijpen tussen sjabloongestuurde en reactieve formulieren
- Formulieren maken en valideren met behulp van formulierbesturingselementen, formuliergroepen, formuliermatrices, enz.
- Met behulp van ingebouwde validators zoals vereist, minLength, maxLength, enz.
- Aangepaste validators maken en gebruiken
HTTP-client
- De rol van de HTTP-client begrijpen in Angular 17
- HTTP-verzoeken maken en gebruiken om te communiceren met backend-services
- Waarnemingen gebruiken om asynchrone gegevensstromen te verwerken
- Interceptors gebruiken om HTTP-verzoeken of -reacties te wijzigen of af te handelen
Nieuwe, declaratieve controlestroom
- Uitleg van de syntaxis van de nieuwe sjabloonbesturingsblokken en hoe deze algemene taken vereenvoudigt, zoals voorwaardelijke weergave, looping en het omgaan met lege verzamelingen
- Voorbeelden geven van het gebruik van de nieuwe blokken, zoals @if, @else, @switch, @case, @default, @for en @empty
- De nieuwe syntaxis vergelijken met de vorige, zoals *ngIf, *ngSwitch en *ngFor
- Vermelden hoe de nieuwe besturingsblokken zoneloze toepassingen met signalen ondersteunen
Uitgestelde laadblokken
- Uitleg over het concept van uitgesteld laden en hoe dit de prestaties en gebruikerservaring van webapplicaties kan verbeteren
- Introductie van het nieuwe @defer-controleblok dat het lui laden van de inhoud van het blok en zijn afhankelijkheden mogelijk maakt
- Voorbeelden geven van het gebruik van het @defer-blok voor verschillende scenario's, zoals het laden van componenten, richtlijnen, pipelines, animaties en stijlen
- Vermelden hoe het @defer-blok werkt met de nieuwe API voor weergaveovergangen
Bekijk Transitions-API
- Uitleg van het doel en de voordelen van de API voor weergaveovergangen, waarmee ontwikkelaars de animaties en overgangen tussen weergaven kunnen aanpassen
- Introductie van de nieuwe withViewTransitions-richtlijn die het gebruik van de view transitions-API mogelijk maakt
- Voorbeelden geven van het gebruik van de instructie withViewTransitions met verschillende overgangstypen, zoals vervagen, schuiven, zoomen en spiegelen
- Vermelden hoe de view transitions API werkt met de Angular router en de browsergeschiedenis
Andere functies en verbeteringen
- Een korte samenvatting van enkele van de andere functies en verbeteringen die Angular 17 biedt, zoals:
- Ondersteuning voor het doorgeven van @Component.styles als een string
- De animatiecode van Angular kan lui worden geladen
- TypeScript 5.2 ondersteuning
- De kernsignaal-API is nu stabiel
- Node.js Ondersteuning voor v16 is verwijderd en de minimale ondersteuningsversie is v18.13.0
- Esbuild zal de standaardbuilder zijn en de standaardontwikkelaarsserver zal Vite gebruiken
Samenvatting en volgende stappen
Requirements
- Een goed begrip van HTML, CSS en JavaScript
- Ervaring met TypeScript en RxJS
- Ervaring met webontwikkeling
Publiek
- Ontwikkelaars die willen leren hoe ze Angular 17 kunnen gebruiken om dynamische en responsieve webapplicaties te maken
- Ontwikkelaars die hun vaardigheden uit eerdere versies van Angular willen upgraden
- Programmeurs die de nieuwe functies en verbeteringen van Angular 17 willen verkennen
Getuigenissen (10)
Good material! The trainer is a really nice guy which helps a lot!
Xander Knol - Conclusion Learning Centers
Cursus - Angular 6
The practical experience of actually working with the code
Chad Roskuge - ALTRON
Cursus - AngularJS Basics
interesting showing the topic
Adam Boroch - SPOC S.A.
Cursus - Angular JavaScript
The labs were interesting and probably the most useful learning tool to me. Anything I missed or forgot about was relearned or reinforced in the labs.
Joseph Fuerst
Cursus - Building Web Apps using the MEAN stack
Ik vond je grappen leuk
Dermot - Griffiths & Armour
Cursus - Angular 2 Fundamentals
Machine Translated
I mostly enjoyed the hands-on training code.
Tomislav Brajkovic - HSE - Healthlink
Cursus - Angular 4: Create Single-Page Applications Using HTML, CSS and JavaScript
Stap voor stap analyse. Elke regel code uitleg. Elk probleem dat ik tijdens de cursus had, werd met succes opgelost en Łukasz vertelde me de reden. Ik vond het ook leuk dat er goede praktijken zijn gepresenteerd. Nooit ben ik overtuigd geweest van de TDD-stijl - ik vind het gewoon niet nuttig en de moeite waard. Łukasz wees op zoveel voordelen van TDD, dat het mijn mening volledig veranderde.
Michał Uściński - Devapo Sp. z o. o.
Cursus - Testing Angular Applications
Machine Translated
część o RxJS
Kacper - INWEBIT Sp. z o.o.
Cursus - Reactive Programming with Angular RxJS
I liked the communication and way of passing knowledge.
Marcin Wojdowski - PSI Polska Sp. z o.o.
Cursus - Angular 5
Good examples and interactive course !