Plan Szkolenia
Wprowadzenie
- Czym jest Angular?
- Angular vs React vs Vue
- Przegląd funkcji i architektury Angular 17
- Konfiguracja środowiska programistycznego
Pierwsze kroki
- Tworzenie nowego projektu Angular 17 przy użyciu Angular CLI
- Przeglądanie struktury projektu i plików
- Uruchamianie i obsługa aplikacji
- Wyświetlanie danych przy użyciu interpolacji i wyrażeń
Komponenty
- Zrozumienie roli komponentów w Angular 17
- Tworzenie i używanie komponentów
- Przekazywanie danych między komponentami przy użyciu danych wejściowych i wyjściowych
- Korzystanie z haków cyklu życia komponentów
Dyrektywy
- Zrozumienie różnicy między dyrektywami strukturalnymi i atrybutowymi
- Tworzenie i używanie wbudowanych dyrektyw, takich jak ngIf, ngFor, ngSwitch itp.
- Tworzenie i używanie niestandardowych dyrektyw
Rury
- Zrozumienie przeznaczenia potoków w Angular 17
- Tworzenie i używanie wbudowanych potoków, takich jak data, waluta, json itp.
- Tworzenie i używanie niestandardowych potoków
Usługi
- Zrozumienie roli usług w Angular 17
- Tworzenie i używanie usług
- Wstrzykiwanie zależności przy użyciu dostawców
Moduły
- Zrozumienie roli modułów w Angular 17
- Tworzenie i używanie modułów
- Importowanie i eksportowanie modułów
Wiązanie danych
- Zrozumienie różnicy między jednokierunkowym i dwukierunkowym wiązaniem danych
- Tworzenie i używanie wiązania właściwości, wiązania zdarzeń i składni banana-in-a-box
- Używanie zmiennych referencyjnych szablonu
Routing
- Zrozumienie roli routingu w Angular 17
- Tworzenie i konfigurowanie tras
- Nawigacja między trasami przy użyciu routerLink i router.navigate()
- Używanie parametrów trasy, parametrów zapytania i fragmentów
Formanty
- Zrozumienie różnicy między formularzami opartymi na szablonach i formularzami reaktywnymi
- Tworzenie i sprawdzanie poprawności formularzy przy użyciu kontrolek formularzy, grup formularzy, tablic formularzy itp.
- Korzystanie z wbudowanych walidatorów, takich jak required, minLength, maxLength itp.
- Tworzenie i używanie niestandardowych walidatorów
Klient HTTP
- Zrozumienie roli klienta HTTP w Angular 17
- Tworzenie i używanie żądań HTTP do komunikacji z usługami zaplecza
- Używanie obserwowalnych do obsługi asynchronicznych strumieni danych
- Używanie przechwytywaczy do modyfikowania lub obsługi żądań lub odpowiedzi HTTP
Nowy, deklaratywny przepływ sterowania
- Wyjaśnienie nowej składni bloków kontrolnych szablonu i sposobu, w jaki upraszcza ona typowe zadania, takie jak renderowanie warunkowe, pętle i obsługa pustych kolekcji.
- Podanie przykładów użycia nowych bloków, takich jak @if, @else, @switch, @case, @default, @for i @empty.
- Porównanie nowej składni z poprzednią, taką jak *ngIf, *ngSwitch i *ngFor.
- Wspomnienie, w jaki sposób nowe bloki sterujące obsługują aplikacje bezstrefowe z sygnałami
Bloki odroczonego ładowania
- Wyjaśnienie koncepcji odroczonego ładowania i sposobu, w jaki może ono poprawić wydajność i wrażenia użytkownika aplikacji internetowych.
- Przedstawienie nowego bloku kontrolnego @defer, który umożliwia leniwe ładowanie zawartości bloku i jego zależności.
- Podanie przykładów użycia bloku @defer w różnych scenariuszach, takich jak ładowanie komponentów, dyrektyw, potoków, animacji i stylów.
- Wspomnienie o tym, jak blok @defer działa z nowym interfejsem API przejść widoku
Interfejs API przejść widoku
- Wyjaśnienie celu i zalet interfejsu API przejść widoku, który umożliwia programistom dostosowywanie animacji i przejść między widokami.
- Przedstawienie nowej dyrektywy withViewTransitions, która umożliwia korzystanie z interfejsu API przejść widoku
- Podanie przykładów użycia dyrektywy withViewTransitions z różnymi typami przejść, takimi jak fade, slide, zoom i flip.
- Wspomnienie o tym, jak API przejść widoku działa z routerem Angular i historią przeglądarki.
Inne funkcje i ulepszenia
- Krótkie podsumowanie niektórych innych funkcji i ulepszeń oferowanych przez Angular 17, takich jak:
- Obsługa przekazywania @Component.styles jako ciągu znaków
- Kod animacji Angular jest leniwie ładowany
- Wsparcie dla wersji TypeScript 5.2
- Główny interfejs API sygnału jest teraz stabilny
- Node.js Obsługa wersji 16 została usunięta, a minimalną wersją wsparcia jest wersja 18.13.0.
- Esbuild będzie domyślnym builderem, a domyślny serwer deweloperski będzie korzystał z Vite.
Podsumowanie i kolejne kroki
Wymagania
- Zrozumienie HTML, CSS i JavaScript
- Doświadczenie z TypeScript i RxJS
- Doświadczenie w tworzeniu stron internetowych
Uczestnicy
- Programiści, którzy chcą dowiedzieć się, jak używać Angular 17 do tworzenia dynamicznych i responsywnych aplikacji internetowych
- Programiści, którzy chcą zaktualizować swoje umiejętności z poprzednich wersji Angular
- Programiści, którzy chcą poznać nowe funkcje i ulepszenia Angular 17
Opinie uczestników (2)
Najbardziej podobał mi się przebieg szkolenia; przeszła przez temat, a pod koniec tematu miała dla nas dobrze zdefiniowane sesje ćwiczeniowe. Była w stanie szybko pokierować nas w kwestiach, które napotkaliśmy podczas sesji treningowych.
Rabin Byanjankar - Lument
Szkolenie - Angular 17
Przetłumaczone przez sztuczną inteligencję
Szkolenie było bardzo interaktywne i pouczające. Trener był bardzo cierpliwy, gdy czegoś nie rozumieliśmy i upewnił się, że nikt nie został w tyle podczas całego szkolenia.
Daniel - INIT Innovations in Transportation Ltd.
Szkolenie - Angular 17
Przetłumaczone przez sztuczną inteligencję