Kurzusleírás
Bevezetés
- Mi az Angular?
- Angular vs React vs Vue
- Az Angular 17 funkcióinak és architektúrájának áttekintése
- Fejlesztői környezet beállítása
Első lépések
- Új Angular 17 projekt létrehozása az Angular CLI segítségével
- A projekt struktúrájának és fájljainak megismerése
- Az alkalmazás futtatása és kiszolgálása
- Adatok megjelenítése interpoláció és kifejezések segítségével
Komponensek
- A komponensek szerepének megértése az Angular 17-ben
- Komponensek létrehozása és használata
- Adatok átadása komponensek között input és output segítségével
- Komponens életciklus eseményei
Direktívák
- A strukturális és attribútum direktívák közötti különbség megértése
- Beépített direktívák létrehozása és használata, például ngIf, ngFor, ngSwitch stb.
- Egyéni direktívák létrehozása és használata
Csövek
- A csövek céljának megértése az Angular 17-ben
- Beépített csövek létrehozása és használata, például dátum, pénznem, json stb.
- Egyéni csövek létrehozása és használata
Szolgáltatások
- A szolgáltatások szerepének megértése az Angular 17-ben
- Szolgáltatások létrehozása és használata
- Függőségek injektálása providerök segítségével
Modulok
- A modulok szerepének megértése az Angular 17-ben
- Modulok létrehozása és használata
- Modulok importálása és exportálása
Adatkötés
- Az egyirányú és kétirányú adatkötés közötti különbség megértése
- Tulajdonságkötés, eseménykötés és banán-a-doboz szintaxis létrehozása és használata
- Sablonhivatkozási változók használata
Útválasztás
- Az útválasztás szerepének megértése az Angular 17-ben
- Útvonalak létrehozása és konfigurálása
- Navigálás útvonalak között a routerLink és a router.navigate() segítségével
- Útvonalparaméterek, lekérdezési paraméterek és fragmentek használata
Űrlapok
- A sablonvezérelt és reaktív űrlapok közötti különbség megértése
- Űrlapok létrehozása és érvényesítése űrlapvezérlők, űrlapcsoportok, űrlaptömbök stb. segítségével
- Beépített érvényesítők használata, például required, minLength, maxLength stb.
- Egyéni érvényesítők létrehozása és használata
HTTP kliens
- Az HTTP kliens szerepének megértése az Angular 17-ben
- HTTP kérések létrehozása és használata a háttérszolgáltatásokkal való kommunikációhoz
- Observable-ok használata aszinkron adatfolyamok kezeléséhez
- Interceptorok használata HTTP kérések vagy válaszok módosításához vagy kezeléséhez
Új, deklaratív vezérlési folyamat
- Az új sablonvezérlési blokk szintaxis magyarázata és hogyan egyszerűsíti a gyakori feladatokat, például a feltételes megjelenítést, ciklusokat és üres gyűjtemények kezelését
- Példák az új blokkok használatára, például @if, @else, @switch, @case, @default, @for és @empty
- Az új szintaxis összehasonlítása a korábbival, például *ngIf, *ngSwitch és *ngFor
- Megemlítés, hogy az új vezérlési blokkok támogatják a zoneless alkalmazásokat jelekkel
Késleltetett betöltési blokkok
- A késleltetett betöltés koncepciójának magyarázata és hogyan javíthatja a webalkalmazások teljesítményét és felhasználói élményét
- Az új @defer vezérlési blokk bemutatása, amely lehetővé teszi a blokk tartalmának és függőségeinek késleltetett betöltését
- Példák a @defer blokk használatára különböző forgatókönyvekben, például komponensek, direktívák, csövek, animációk és stílusok betöltése
- Megemlítés, hogy a @defer blokk hogyan működik az új nézetátmenetek API-val
Nézetátmenetek API
- A nézetátmenetek API céljának és előnyeinek magyarázata, amely lehetővé teszi a fejlesztők számára a nézetek közötti animációk és átmenetek testreszabását
- Az új withViewTransitions direktíva bemutatása, amely lehetővé teszi a nézetátmenetek API használatát
- Példák a withViewTransitions direktíva használatára különböző átmenettípusokkal, például fade, slide, zoom és flip
- Megemlítés, hogy a nézetátmenetek API hogyan működik az Angular útválasztóval és a böngésző előzményeivel
Egyéb funkciók és fejlesztések
- Röviden összefoglalva az Angular 17 néhány további funkcióját és fejlesztését, például:
- Támogatás a @Component.styles sztringként való átadásához
- Az Angular animációs kódja késleltethetően betölthető
- TypeScript 5.2 támogatás
- A core signal API mostantól stabil
- A Node.js v16 támogatása megszűnt, a minimális támogatott verzió a v18.13.0
- Az Esbuild lesz az alapértelmezett builder, és az alapértelmezett fejlesztői szerver a Vite-t fogja használni
Összefoglalás és következő lépések
Követelmények
- HTML, CSS és JavaScript ismerete
- Tapasztalat TypeScript és RxJS használatában
- Webfejlesztési tapasztalat
Célközönség
- Fejlesztők, akik szeretnék megtanulni, hogyan használják az Angular 17-et dinamikus és reszponzív webalkalmazások létrehozásához
- Fejlesztők, akik szeretnék frissíteni tudásukat az Angular korábbi verzióiból
- Programozók, akik szeretnék felfedezni az Angular 17 új funkcióit és fejlesztéseit
Vélemények (2)
Nagyon tetszett a képzés folyamata; átment a téma átvitjén, és a téma végén jól meghatározott gyakorló munkákat adott nekünk. Gyorsan tudott iránymutatást adni a gyakorló feladatok során felmerülő problémákban.
Rabin Byanjankar - Lument
Kurzus - Angular 17
Gépi fordítás
Ez nagyon interaktív és informatikus volt. A képzőtanár nagyon türelmes volt velünk, amikor valamit nem értettünk, és biztosította, hogy senki se maradj hátra a képzés során.
Daniel - INIT Innovations in Transportation Ltd.
Kurzus - Angular 17
Gépi fordítás