Szkolenie Tworzenie aplikacji SPA z frameworkiem Angular
Poziom
ŚredniozaawansowanyCzas
32h / 4 dniTermin
IndywidualnieCena
IndywidualnieSzkolenie Tworzenie aplikacji SPA z frameworkiem Angular
Szkolenie dla programistów, którzy chcą tworzyć aplikacje SPA w przewidywalny i utrzymywalny sposób z użyciem współczesnego Angulara. Program obejmuje TypeScript, Angular CLI, komponenty, szablony, standalone components, dependency injection, nową składnię sterującą, sygnały, formularze, RxJS, HttpClient, routing, lazy loading, obsługę błędów oraz praktyczne wzorce organizacji kodu. Uczestnicy uczą się budować aplikacje front-endowe, które są czytelne, testowalne, skalowalne i gotowe do dalszego rozwoju w środowisku projektowym.
Dla kogo jest to szkolenie?
Dla programistów znających HTML, CSS, JavaScript i podstawy TypeScript, którzy chcą tworzyć aplikacje webowe typu SPA z użyciem Angulara-
Dla programistów front-end lub full-stack, którzy chcą uporządkować pracę z komponentami, routingiem, formularzami, RxJS, komunikacją HTTP i współczesnymi mechanizmami Angulara
-
Dla osób pracujących z aplikacjami Angular, które chcą lepiej rozumieć aktualne wzorce projektowe, standalone components, sygnały, dependency injection i organizację kodu
Czego nauczysz się na szkoleniu?
- Skonfigurujesz projekt Angular z użyciem Angular CLI, TypeScript i współczesnej struktury aplikacji
- Zbudujesz komponenty, szablony i przepływ danych z użyciem bindingu, dyrektyw, @Input, @Output, lifecycle hooks oraz pipes
- Zastosujesz standalone components, dependency injection, nową składnię sterującą, lazy loading z @defer oraz podstawy sygnałów
- Przygotujesz formularze z walidacją, obsłużysz dane reaktywne z RxJS i wykorzystasz Async Pipe
- Połączysz aplikację z API przez HttpClient, obsłużysz błędy, nagłówki, dane formularzy i scenariusze komunikacji z serwerem
- Skonfigurujesz routing aplikacji SPA, nawigację programową, zagnieżdżone widoki oraz obsługę nieistniejących ścieżek
Program szkolenia
Dzień 1
Wprowadzenie do Angular
- Podstawowe pojęcia frameworka Angular i architektury aplikacji SPA
- Angular CLI jako narzędzie generowania kodu i obsługi projektu
- Struktura projektu Angular, pliki konfiguracyjne i organizacja katalogów
- Podstawy TypeScript: klasy, interfejsy, adnotacje i typy sparametryzowane
Komponenty i szablony
- Klasy komponentów, dekoratory, selektory oraz szablony: text binding, property binding, event binding i two-way binding
- Wbudowane dyrektywy Angular: *ngIf, *ngFor, ngClass i ngStyle
- Architektura komponentów i enkapsulacja widoku
- Przekazywanie danych do komponentów za pomocą @Input
- Emitowanie zdarzeń z komponentów za pomocą @Output
- Lifecycle hooks i cykl życia komponentu
- Pipes w Angular i formatowanie danych w widoku
Dzień 2
Nowoczesny Angular
- Mechanizmy dependency injection w praktyce projektowej
- Wzorce projektowe i dobre praktyki organizacji kodu
- Aktualizacja aplikacji i migracja do nowszej wersji Angulara
- NgModule, SharedModule i Standalone Components w aktualnym podejściu Angular
- Nowa składnia Angular: @if, @for i @switch
- Leniwe ładowanie komponentów z @defer
- Sygnały, reaktywność i dobre praktyki pracy ze stanem
- Pułapki migracji, kompatybilność i ograniczenia nowych mechanizmów Angular
Dzień 3
Formularze i RxJS
- Formularze w Angular: typy wejściowe, walidacja danych i komunikaty błędów
- Podstawy RxJS: Observable vs Promise oraz podstawowe operatory
- RxJS w Angular, multicast, share i Async Pipe
Moduł HTTP
- Konfiguracja i użycie HttpClient w Angular
- Pobieranie danych i wysyłanie danych z formularza do serwera
- Obsługa błędów i własne nagłówki w żądaniach HTTP
- Praktyczne przykłady komunikacji z serwerem
Dzień 4
Nawigacja i Pipes
- Angular Router, struktura modułu nawigacyjnego i konfiguracja tras
- Nawigacja z TypeScript i programowe przejścia między widokami
- Obsługa zagnieżdżonych komponentów i widoków potomnych
- Obsługa nieistniejących linków i ścieżek awaryjnych
Praktyka i Podsumowanie
- Praktyczne ćwiczenia i projekt aplikacji SPA
- Praktyczne zastosowania Angular w tworzeniu aplikacji SPA
- Sesja pytań i odpowiedzi oraz podsumowanie kluczowych decyzji projektowych
