APLIKACE A WEB ROZVOJ
Angular 15 Programování
DÉLKA 5 dní
VERZE 15
PROČ STUDOVAT TENTO KURZ
Tento intenzivní a komplexní školicí kurz Angular 15 poskytuje účastníkům dovednosti, které mohou okamžitě použít ve své práci. Naučíte se základy vývoje Angular 15, jako jsou jednostránkové aplikace prohlížeče, responzivní weba hybridních mobilních aplikací.
Tento kurz je kombinací teoretického učení a praktických cvičení, která zahrnuje úvod do Angularu, následovaný TypeScriptem, komponentami, přímými funkcemi, službami, HTTPClientem, testováním a laděním.
Poznámka: Můžeme také poskytnout školení na jiných verzích Angular. Prosím, kontaktujte nás pro poptávku nebo zaregistrujte svůj zájem.
ÚHOLNÍ AT LUMIFY WORK
CO SE NAUČÍTE
Po úspěšném absolvování tohoto kurzu budete mít znalosti:
- Vyvíjejte jednostránkové úhlové aplikace pomocí Typescript
- Nastavte kompletní vývojové prostředí Angular
- Vytvářejte komponenty, přímé příkazy, služby, kanály, formuláře a vlastní validátory
- Zvládejte pokročilé úlohy získávání síťových dat pomocí Observables
- Spotřebujte data z REST web služby pomocí Angular HTTP klienta
- Manipulujte s ionty připojení push-data pomocí WebZásuvkový protokol
- Pracujte s Angular Pipes pro formátování dat
- Používejte pokročilé funkce Angular Component Router
- Testujte a laďte ionty úhlových aplikací pomocí vestavěných nástrojů
- Práce s Angular CLI
Můj instruktor byl skvělý, když dokázal zasadit scénáře do skutečných případů, které se týkaly mé konkrétní situace.
Od chvíle, kdy jsem dorazil, jsem se cítil vítán a schopnost sedět jako skupina mimo třídu a diskutovat o našich situacích a našich cílech byla nesmírně cenná.
Naučil jsem se hodně a cítil jsem, že je důležité, aby mé cíle, které jsem se zúčastnil tohoto kurzu, byly splněny.
Skvělá práce týmu Lumify Work.
AMANDA NICOL
MANAŽER SLUŽEB IT PODPORY – HEALTH WORLD LIMITED
PŘEDMĚTY KURZU
- Představujeme Angular
• Co je Angular?
• Centrální vlastnosti Angular Framework
• Vhodné případy použití
• Stavební bloky úhlové aplikace
• Základní architektura úhlové aplikace
• Instalace a používání Angular
• Anatomie úhlové aplikace
• Spuštění aplikace Applicat ion
• Sestavení a nasazení aplikace
• Angular pro nativní mobilní aplikace - Úvod do TypeScriptu
• Programovací jazyky pro použití s Angular
• Syntaxe TypeScript
• Programovací editory
• Typový systém – definice proměnných
• Typový systém – Definování polí
• Základní primitivní typy
• Zadejte funkční ionty
• Odvození typu
• Definování tříd
• Třídní metody
• Kontrola viditelnosti
• Konstruktory tříd
• Konstruktory tříd – Alternativní forma
• Neinicializovaná pole
• Rozhraní
• Práce s moduly ES6
• var vs let
• Funkce šipek
• Kompaktní syntaxe funkce šipky
• Řetězce šablon
• Generika ve třídě
• Generics in Function ion - Komponenty
• Co je to komponenta?
• Přample Komponenta
• Vytvoření komponenty pomocí Angular CLI
• Třída komponent
• @Component Decorator
• Registrace součásti do jejího modulu
• Šablona součásti
• Přample: Šablona HelloComponent
• Přample: Třída HelloComponent
• Použití komponenty
• Spusťte aplikaci
• Hierarchie komponent
• Kořenová komponenta aplikace
• Bootstrap File
• Háčky životního cyklu součástí
• Přample Lifecycle Háčky
• Styly CSS - Šablony součástí
• Šablony
• Umístění šablony
• Syntaxe Mustache {{ }}
• Nastavení vlastností prvku DOM
• Nastavení textu těla prvku
• Vazba události
• Zpracování události výrazu
• Zabránit výchozí manipulaci
• Směrnice atributů
• Aplikujte styly změnou tříd CSS
• Přample: ngClass
• Přímé použití stylů
• Strukturální směrnice
• Podmíněně spustit šablonu
• Přample: ngIf
• Looping pomocí ngFor
• ngFor Local Variables
• Manipulace se sbírkou
• Přample – Odstranění položky
• Sledování položek pomocí ngFor
• Výměna prvků pomocí ngSwitch
• Seskupování prvků
• Referenční proměnná šablony - Interkomponentní komunikace
• Základy komunikace
• Architektura toku dat
• Příprava dítěte na příjem dat
• Odeslat data od rodiče
• Více o vlastnostech nastavení
• Událost odpálení z komponenty
• @Output() Přample – Podřízená složka
• @Output() Přample – Nadřazená komponenta
• Plná dvoucestná vazba
• Nastavení obousměrné datové vazby v nadřazené funkci - Šablona a řízené formuláře
• Formuláře řízené šablonou
• Import modulu formulářů
• Základní přístup
• Nastavení formuláře
• Získání uživatelského vstupu
• Vynechání atributu ngForm
• Inicializujte formulář
• Dvoucestná datová vazba
• Ověření formuláře
• Úhlové validátory
• Zobrazení stavu ověření pomocí tříd
• Další typy vstupů
• Zaškrtávací políčka
• Vyberte (rozbalovací) pole
• Možnosti vykreslování pro výběr (rozbalovací nabídka)
• Datumová pole
• Přepínače - Reaktivní formy
• Reaktivní formy přesview
• Stavební bloky
• Importujte modul Reactive FormsModule
• Vytvořte formulář
• Navrhněte šablonu
• Získání vstupních hodnot
• Inicializace vstupních polí
• Nastavení hodnot formuláře
• Přihlášení k odběru změn vstupu
• Validace
• Vestavěné validátory
• Zobrazuje se chyba ověření
• Vlastní validátor
• Použití vlastního validátoru
• Dodání konfigurace do Custom Validator
• FormArray – Dynamicky přidávat vstupy
• FormArray – Třída komponent
• FormArray – Šablona
• FormArray – Hodnoty
• Sub FormGroups – Třída komponent
• Sub FormGroups – HTML šablona
• Proč používat podskupiny formulářů - Služby a injekce závislostí
• Co je to služba?
• Vytvoření základní služby
• Třída služeb
• Co je Dependency Injection?
• Vložení servisní instance
• Vstřikovače
• Hierarchie vstřikovačů
• Registrace služby u kořenového injektoru
• Registrace služby u vstřikovače komponenty
• Zaregistrujte službu u vstřikovače funkčního modulu
• Kde zaregistrovat službu?
• Injekce závislosti v jiných artefaktech
• Poskytování alternativní implementace
• Dependency Injection a @Host
• Dependency Injection a @Optional - HTTP klient
• Klient Angular HTTP
• Použití klienta HTTP – Overview
• Import HttpClientModule
• Služba pomocí HttpClient
• Zadání požadavku GET
• Co dělá pozorovatelný objekt?
• Používání služby v komponentě
• Klientská komponenta PeopleService
• Vypořádání se s chybou
• Přizpůsobení objektu Error
• Odeslání požadavku POST
• Zadání požadavku PUT
• Odeslání požadavku SMAZÁNÍ - Trubky a formátování dat
• Co jsou potrubí?
• Vestavěné trubky
• Použití Pipes v HTML šabloně
• Řetězové trubky
• Mezinárodně uspořádané potrubí (i18n)
• Načítání dat národního prostředí
• Datum Pipe
• Číslo potrubí
• Měnová trubka
• Vytvořit vlastní potrubí
• Vlastní potrubí Přample
• Použití uživatelských potrubí
• Použití potrubí s ngFor
• Filtrační trubka
• Kategorie potrubí: čisté a nečisté
• Pure Pipe Example
• Nečisté potrubí Přample - Úvod do jednostránkových aplikací
• Co je to jednostránková aplikace (SPA)
• Tradiční Web Aplikace
• Pracovní postup SPA
• Jednostránková aplikace Advantages
• HTML5 History API
• SPA výzvy
• Implementace SPA pomocí Angular - Router Angular Component Router
• Component Router
• View Navigace
• Angular Router API
• Vytvoření aplikace s podporou směrovače
• Hostování směrovaných komponent
• Navigace pomocí odkazů a tlačítek
• Programatická navigace
• Předávání parametrů trasy
• Navigace pomocí parametrů trasy
• Získání hodnot parametrů trasy
• Synchronní načítání parametru trasy
• Asynchronní načítání parametru trasy
• Parametry dotazu
• Dodání parametrů dotazu
• Asynchronní získávání parametrů dotazu
• Problémy s manuálem URL vstup a záložka - Pokročilý HTTP klient
• Možnosti požadavku
• Vrácení objektu HttpResponse
• Nastavení záhlaví požadavků
• Vytváření nových pozorovatelných objektů
• Vytvoření jednoduchého pozorovatelného
• Metoda pozorovatelného konstruktoru
• Pozorovatelní operátoři
• Mapa a filtr Operátoři
• Operátor flatMap().
• Operátor tap().
• Kombinátor zip().
• Ukládání odpovědi HTTP do mezipaměti
• Provádění sekvenčních HTTP volání
• Provádění paralelních hovorů
• Přizpůsobení objektu Error pomocí catchError()
• Chyba v potrubí
• Error Recovery - Úhlové moduly
• Proč Angular Modules?
• Anatomie modulové třídy
• Vlastnosti @NgModule
• Moduly funkcí
• Přample Struktura modulu
• Vytvořte modul domény
• Vytvořte směrovaný/směrovací modulový pár
• Vytvořte servisní modul
• Vytváření společných modulů
• Použití jednoho modulu z druhého - Pokročilé směrování
• Modul funkcí povoleno směrování
• Použití modulu funkcí
• Líné načítání modulu funkcí
• Vytváření odkazů pro komponenty Feature Module
• Více o líném načítání
• Předběžné načítání modulů
• vazba routerLinkActive
• Výchozí trasa
• Cesta trasy se zástupnými znaky
• přesměrovatNa
• Dětské trasy
• Definování podřízených tras pro podřízené trasy
• Odkazy na dětské trasy
• Navigační stráže
• Vytváření implementací stráží
• Použití stráží na trase - Unit Testing Angular Applications
• Testování jednotek úhlových artefaktů
• Testovací nástroje
• Typické testovací kroky
• Výsledky testů
• Jasmine Test Suites
• Specifikace jasmínu (testy jednotek)
• Očekávání (uplatňovat ionty)
• Matchers
• Přampsoubory používání dohazovačů
• Použití vlastnosti not
• Nastavení a odstranění v Unit Test Suite
• Přampsoubor funkcí beforeEach a afterEach
• Úhlový testovací modul
• Přample Úhlový testovací modul
• Testování služby
• Vložení servisní instance
• Vyzkoušejte synchronní metodu
• Otestujte asynchronní metodu
• Použití Mock HTTP klienta
• Poskytování předpřipravené odezvy
• Testování součásti
• Testovací modul součástí
• Vytvoření instance komponenty
• Třída ComponentFixture
• Základní testy součástí
• Třída DebugElement
• Simulace uživatelské interakce - Ladění
• Konecview úhlového ladění
• Viewing TypeScript Code v Debuggeru
• Použití klíčového slova debuggeru
• Protokolování ladění
• Co je Angular DevTools?
• Použití Angular DevTools
• Angular DevTools – Struktura komponent
• Angular DevTools – Změna Detect ion Execution
• Zachycování chyb syntaxe
PRO KOHO JE KURZ URČEN?
Tento kurz je zaměřen na každého, kdo se potřebuje naučit základy vývoje Angular 15 a rovnou je aplikovat při tvorbě web aplikací.
Můžeme také dodat a upravit tento školicí kurz pro větší skupiny – šetříme tak vaší organizaci čas, peníze a zdroje. Pro více informací nás prosím kontaktujte prostřednictvím emailu na ph.training@lumifywork.com
Předpoklady
- Web Abyste z tohoto kurzu Angular vytěžili maximum, jsou nutné zkušenosti s vývojem pomocí HTML, CSS a JavaScriptu
- Užitečná je také znalost prohlížeče DOM
- Nejsou vyžadovány žádné předchozí zkušenosti s Angular nebo AngularJS
Poskytování těchto kurzů společností Lumify Work se řídí rezervačními podmínkami.
Před přihlášením do tohoto kurzu si prosím pozorně přečtěte podmínky, protože přihlášení do kurzu je podmíněno přijetím těchto podmínek.
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
Dokumenty / zdroje
 |
LUMIFY WORK Angular 15 Programování [pdfUživatelská příručka Angular 15 Programování, Programování |
