APLIKÁCIA A WEB ROZVOJ
Programovanie Angular 15
DĹŽKA 5 dní
VERZIA 15
PREČO ŠTUDOVAŤ TENTO KURZ
Tento intenzívny a komplexný vzdelávací kurz Angular 15 poskytuje účastníkom zručnosti, ktoré môžu okamžite použiť pri svojej práci. Naučíte sa základy vývoja Angular 15, ako sú jednostránkové aplikácie prehliadača, responzívne weba hybridné mobilné aplikácie.
Tento kurz je kombináciou teoretického učenia a praktických laboratórií, ktorý zahŕňa úvod do Angular, po ktorom nasleduje TypeScript, komponenty, priame aplikácie, služby, HTTPClient, testovanie a ladenie.
Poznámka: Môžeme tiež poskytnúť školenie na iných verziách Angular. Prosím, kontaktujte nás pre dopyt alebo registrujte svoj záujem.
UHOLNÝ AT LUMIFY WORK
ČO SA NAUČÍTE
Po úspešnom absolvovaní tohto kurzu budete mať znalosti:
- Vyviňte jednostránkové uhlové aplikačné ióny pomocou Typescript
- Nastavte kompletné vývojové prostredie Angular
- Vytvárajte komponenty, priame príkazy, služby, kanály, formuláre a vlastné validátory
- Zvládajte pokročilé úlohy získavania údajov zo siete pomocou Observables
- Spotrebujte dáta z REST web služby pomocou klienta Angular HTTP Client
- Manipulujte s push-data pripojením iónov pomocou WebZásuvkový protokol
- Pri formátovaní údajov pracujte s Angular Pipes
- Používajte pokročilé funkcie uhlového komponentného smerovača
- Testujte a laďte ióny aplikácie Angular pomocou vstavaných nástrojov
- Pracujte s Angular CLI
Môj inštruktor bol skvelý, keď dokázal vložiť scenáre do skutočných prípadov, ktoré sa týkali mojej konkrétnej situácie.
Cítil som sa vítaný od chvíle, keď som prišiel, a schopnosť sedieť ako skupina mimo triedy a diskutovať o našich situáciách a našich cieľoch bola mimoriadne cenná.
Veľa som sa naučil a cítil som, že je dôležité, aby sa moje ciele návštevou tohto kurzu splnili.
Skvelá práca Lumify Work team.AMANDA NICOL
MANAŽÉR SLUŽIEB IT PODPORY – HEALTH WORLD LIMITED
PREDMETY KURZOV
- Predstavujeme Angular
• Čo je to Angular?
• Centrálne vlastnosti Angular Framework
• Vhodné prípady použitia
• Stavebné bloky uhlovej aplikácie
• Základná architektúra uhlovej aplikácie
• Inštalácia a používanie Angular
• Anatómia uhlovej aplikácie
• Spustenie aplikácie
• Vytvorenie a nasadenie aplikácie
• Angular pre natívne mobilné aplikácie - Úvod do TypeScript
• Programovacie jazyky pre použitie s Angular
• Syntax TypeScript
• Editori programovania
• Typový systém – definovanie premenných
• Typový systém – Definovanie polí
• Základné primitívne typy
• Zadajte funkčné ióny
• Inferencia typu
• Definovanie tried
• Triedne metódy
• Kontrola viditeľnosti
• Konštruktory tried
• Konštruktory tried – alternatívna forma
• Neinicializované polia
• Rozhrania
• Práca s modulmi ES6
• var vs let
• Funkcie šípok
• Kompaktná syntax funkcie šípok
• Reťazce šablón
• Generiká v triede
• Generics in Function ion - Komponenty
• Čo je komponent?
• Príklample Komponent
• Vytvorenie komponentu pomocou Angular CLI
• Trieda komponentov
• @Component Decorator
• Registrácia komponentu do jeho modulu
• Šablóna komponentu
• Naprample: HelloComponent Template
• Naprample: Trieda HelloComponent
• Používanie komponentu
• Spustite aplikáciu
• Hierarchia komponentov
• Aplikačný iónový koreňový komponent
• Bootstrap File
• Háčiky životného cyklu komponentov
• Naprample Lifecycle Háčiky
• CSS štýly - Šablóny komponentov
• Šablóny
• Umiestnenie šablóny
• Syntax Moustache {{ }}
• Nastavenie vlastností prvku DOM
• Nastavenie textu tela prvku
• Väzba udalosti
• Ovládač udalostí výrazov
• Zabrániť predvolenej manipulácii
• Smernice o atribútoch
• Použiť štýly zmenou tried CSS
• Naprample: ngClass
• Priama aplikácia štýlov
• štrukturálne smernice
• Podmienečne spustiť šablónu
• Naprample: ngIf
• Slučovanie pomocou ngFor
• ngPre lokálne premenné
• Manipulácia so zbierkou
• Naprample – Odstránenie položky
• Sledovanie položiek pomocou ngFor
• Výmena prvkov pomocou ngSwitch
• Zoskupovanie prvkov
• Referenčná premenná šablóny - Komunikácia medzi komponentmi
• Základy komunikácie
• Architektúra toku údajov
• Príprava dieťaťa na príjem údajov
• Odoslať údaje od rodiča
• Viac o vlastnostiach nastavenia
• Udalosť odpálenia z komponentu
• @Output() Naprample – Detský komponent
• @Output() Naprample – Nadradený komponent
• Úplné obojsmerné viazanie
• Nastavenie obojsmernej dátovej väzby v nadradenej časti - Šablóna a riadené formuláre
• Formuláre riadené šablónou
• Import modulu formulárov
• Základný prístup
• Nastavenie formulára
• Získanie používateľského vstupu
• Vynechanie atribútu ngForm
• Inicializujte formulár
• Obojsmerná dátová väzba
• Overenie formulára
• Uhlové validátory
• Zobrazenie stavu validácie pomocou tried
• Ďalšie typy vstupu
• Začiarkavacie políčka
• Vyberte (rozbaľovacie) polia
• Možnosti vykresľovania pre výber (rozbaľovacia ponuka)
• Dátumové polia
• Prepínače - Reaktívne formy
• Reaktívne formy Overview
• Stavebné bloky
• Importovať modul Reactive FormsModule
• Vytvorte formulár
• Navrhnite šablónu
• Získanie vstupných hodnôt
• Inicializácia vstupných polí
• Nastavenie hodnôt formulára
• Prihlásenie na odber zmien vstupu
• Validácia
• Zabudované validátory
• Zobrazuje sa chyba overenia
• Vlastný validátor
• Používanie vlastného validátora
• Dodanie konfigurácie vlastnému validátorovi
• FormArray – Dynamicky pridávať vstupy
• FormArray – Trieda komponentov
• FormArray – Šablóna
• FormArray – Hodnoty
• Sub FormGroups – Trieda komponentov
• Sub FormGroups – HTML šablóna
• Prečo používať podskupiny formulárov - Služby a injekcie závislosti
• Čo je to služba?
• Vytvorenie základnej služby
• Servisná trieda
• Čo je to Dependency Injection?
• Vloženie inštancie služby
• Injektory
• Hierarchia vstrekovačov
• Registrácia služby pomocou koreňového injektora
• Registrácia služby pomocou vstrekovača komponentu
• Zaregistrujte službu pomocou vstrekovača s funkčným modulom
• Kde zaregistrovať službu?
• Injekcia závislosti v iných artefaktoch
• Poskytnutie alternatívnej implementácie
• Dependency Injection a @Host
• Dependency Injection a @Voliteľné - HTTP klient
• Klient Angular HTTP
• Používanie klienta HTTP – Overview
• Importovať HttpClientModule
• Služba pomocou HttpClient
• Podanie žiadosti GET
• Čo robí pozorovateľný objekt?
• Používanie Služby v Komponente
• Klientsky komponent PeopleService
• Spracovanie chýb
• Prispôsobenie objektu Error
• Vytvorenie požiadavky POST
• Zadanie požiadavky PUT
• Zadanie požiadavky na VYMAZANIE - Rúry a formátovanie údajov
• Čo sú potrubia?
• Vstavané potrubia
• Používanie potrubí v šablóne HTML
• Reťazové potrubia
• Medzinárodne nacionalizované potrubia (i18n)
• Načítavanie miestnych údajov
• Dátum Pipe
• Číslo potrubia
• Menové potrubie
• Vytvorte si vlastné potrubie
• Vlastné potrubie naprample
• Používanie vlastných potrubí
• Použitie potrubia s ngFor
• Filtračné potrubie
• Kategória potrubia: čisté a nečisté
• Pure Pipe Example
• Nečisté potrubie naprample - Úvod do jednostránkových aplikácií
• Čo je to jednostránková aplikácia (SPA)
• Tradičné Web Aplikácia
• Pracovný postup SPA
• Jednostránková aplikácia Advantages
• HTML5 History API
• SPA výzvy
• Implementácia SPA pomocou Angular - Uhlový komponentný smerovač
• Komponentný smerovač
• View Navigácia
• Angular Router API
• Vytvorenie aplikácie s podporou smerovača
• Hostenie smerovaných komponentov
• Navigácia pomocou prepojení a tlačidiel
• Programová navigácia
• Prechádzanie parametrov trasy
• Navigácia s parametrami trasy
• Získanie hodnôt parametrov trasy
• Synchrónne získavanie parametra trasy
• Asynchrónne získavanie parametra trasy
• Parametre dopytu
• Dodanie parametrov dotazu
• Asynchrónne získavanie parametrov dotazu
• Problémy s manuálom URL vstup a záložka - Pokročilý HTTP klient
• Možnosti žiadosti
• Vrátenie objektu HttpResponse
• Nastavenie hlavičiek požiadaviek
• Vytváranie nových pozorovateľných objektov
• Vytvorenie jednoduchého pozorovateľného objektu
• Metóda pozorovateľného konštruktéra
• Pozorovateľné operátory
• Mapa a filter operátorov
• Operátor flatMap().
• Operátor kohútika ().
• Kombinátor zipsu
• Ukladanie odpovede HTTP do vyrovnávacej pamäte
• Uskutočňovanie sekvenčných HTTP volaní
• Uskutočňovanie paralelných hovorov
• Prispôsobenie objektu chyby pomocou funkcie catchError()
• Chyba v potrubí
• Obnova po chybe - Uhlové moduly
• Prečo uhlové moduly?
• Anatómia modulovej triedy
• Vlastnosti @NgModule
• Moduly funkcií
• Naprample Štruktúra modulu
• Vytvorte modul domény
• Vytvorte pár smerovacích/smerovacích modulov
• Vytvorte servisný modul
• Vytváranie spoločných modulov
• Používanie jedného modulu z druhého - Pokročilé smerovanie
• Povolený modul funkcie smerovania
• Používanie modulu funkcií
• Lenivé načítanie modulu funkcií
• Vytváranie prepojení pre komponenty Feature Module
• Viac o Lazy Loading
• Predbežné načítanie modulov
• väzba routerLinkActive
• Predvolená trasa
• Trasa so zástupným znakom
• presmerovať na
• Detské trasy
• Definovanie podriadených trás pre podriadené trasy
• Odkazy na detské trasy
• Navigačné stráže
• Vytváranie implementácií stráží
• Používanie stráží na trase - Jednotkové testovanie uhlových aplikácií
• Uhlové artefakty testovania jednotiek
• Testovacie nástroje
• Typické kroky testovania
• Výsledky testu
• Testovacie suity Jasmine
• Špecifikácie jasmínu (testy jednotiek)
• Očakávania (uplatňujte ióny)
• Zápasy
• Naprampsúbory Používanie Matchers
• Používanie nevlastníctva
• Nastavenie a zrušenie v Unit Test Suite
• Naprampsúbor funkcií beforeEach a afterEach
• Uhlový testovací modul
• Naprample Uhlový testovací modul
• Testovanie služby
• Vloženie inštancie služby
• Otestujte synchrónnu metódu
• Otestujte asynchrónnu metódu
• Používanie falošného HTTP klienta
• Poskytovanie predpripravenej odozvy
• Testovanie komponentu
• Modul testovania komponentov
• Vytvorenie inštancie komponentu
• Trieda ComponentFixture
• Testy základných komponentov
• Trieda DebugElement
• Simulácia interakcie používateľa - Ladenie
• Koniecview uhlového ladenia
• Viewing TypeScript Code v Debuggeri
• Používanie kľúčového slova ladiaceho nástroja
• Debug protokolovanie
• Čo je Angular DevTools?
• Používanie Angular DevTools
• Angular DevTools – Štruktúra komponentov
• Angular DevTools – Zmeňte spustenie detekcie iónov
• Zachytenie chýb syntaxe
PRE KOHO JE KURZ URČENÝ?
Tento kurz je určený pre každého, kto sa potrebuje naučiť základy vývoja Angular 15 a použiť ich priamo pri tvorbe web aplikácie.
Tento tréningový kurz môžeme dodať a prispôsobiť aj pre väčšie skupiny – šetríme tak čas, peniaze a zdroje vašej organizácie. Pre viac informácií nás prosím kontaktujte e-mailom na ph.training@lumifywork.com
PREDPOKLADY
- Web Aby ste z tohto kurzu Angular vyťažili maximum, sú potrebné skúsenosti s vývojom pomocou HTML, CSS a JavaScriptu
- Užitočná je aj znalosť prehliadača DOM
- Nevyžadujú sa žiadne predchádzajúce skúsenosti s Angular alebo AngularJS
Poskytovanie týchto kurzov spoločnosťou Lumify Work sa riadi podmienkami rezervácie.
Pred prihlásením sa do tohto kurzu si pozorne prečítajte zmluvné podmienky, pretože registrácia do kurzu je podmienená prijatím týchto zmluvných podmienok.
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 Programovanie [pdf] Používateľská príručka Angular 15 Programovanie, Programovanie |