LUMIFY WORK Angular 12 Programiranje

ZAŠTO UČITI OVAJ KURS

Ovaj sveobuhvatni kurs Angular 12 programiranja kombinacija je teorijskog učenja i praktičnih laboratorija koji uključuje uvod u Angular, praćen TypeScriptom, komponentama, direktivama, uslugama, HTTP klijentom, testiranjem i otklanjanjem grešaka.
Kurs je prepun korisnih i praktičnih informacija koje možete odmah primijeniti na svoj rad. Naučite osnove osnovnog razvoja Angulara 12, kao što su aplikacije preglednika na jednoj stranici, koje odgovaraju webweb stranice i hibridne mobilne aplikacije.
Napomena: Također možemo pružiti obuku o drugim verzijama Angular-a. Molimo kontaktirajte nas kako biste postavili upit ili registrirali svoj interes.

ŠTA ĆETE NAUČITI
Nakon uspješnog završetka ovog kursa, moći ćete:

• Razvijte jednostrane Angular aplikacije koristeći Typescript
• Postavite kompletno Angular razvojno okruženje
• Kreirajte komponente, direktive, usluge, cijevi, obrasce i prilagođene validatore
• Rukujte naprednim zadacima preuzimanja mrežnih podataka koristeći Observables Konzumirajte podatke iz REST-a web usluge koristeći Angular HT TP Client Rukuju push-data konekcijama koristeći WebProtokol utičnica
• Radite s kutnim cijevima za formatiranje podataka
• Koristite napredne funkcije Angular Component Routera
• Testirajte i otklanjajte greške u Angular aplikacijama koristeći ugrađene alate.

PREDMETI PREDMETA

Poglavlje 1. Predstavljanje Angulara

• Šta je Angular?
• Centralne karakteristike Angular Framework-a Prikladni slučajevi upotrebe
• Građevinski blokovi Angular aplikacije Osnovna arhitektura Angular aplikacije Instaliranje i korištenje Angulara
• Anatomija ugaone aplikacije koja pokreće aplikaciju
• Izgradnja i implementacija aplikacije Angular za izvorne mobilne aplikacije
• Rezime

Poglavlje 2. Uvod u TypeScript

• Programski jezici za upotrebu sa sintaksom Angular TypeScript
• Urednici programiranja
• Sistem tipova – definiranje varijabli
• Sistem tipova – definiranje nizova
• Osnovni primitivni tipovi
• Ukucajte Funkcije
• Upišite Zaključak
• Definisanje klasa
• Class Methods
• Kontrola vidljivosti
• Konstruktori klasa
• Konstruktori klasa – Neinicijalizirana polja alternativnog oblika
• Interfejsi
• Rad sa ES6 modulima
• var vs let
• Funkcije sa strelicama
• Strelica Funkcija Compact Syntax Template Stings
• Generici u klasi
• Generici u funkciji
• Rezime

Poglavlje 3. Komponente

• Šta je komponenta?
• An Example Component
• Kreiranje komponente koristeći Angular CLI
• Klasa komponenti
• @Component Decorator
• Registriranje komponente u predlošku komponente modula
• Example: HelloComponent Template
• Example: Klasa HelloComponent koja koristi komponentu
• Pokrenite aplikaciju
• Hijerarhija komponenti
• Korijenska komponenta aplikacije
• The Bootstrap File
• Kuke životnog ciklusa komponente Example Lifecycle Hooks
• CSS stilovi
• Rezime

Poglavlje 4. Predlošci komponenti

• Predlošci
• Lokacija predloška
• Sintaksa brkova {{ }}
• Postavljanje svojstava DOM elementa
• Postavljanje teksta tijela elementa
• Vezivanje događaja
• Obrađivač događaja izraza
• Sprečavanje zadanog rukovanja
• Direktive o atributima
• Primijenite stilove promjenom CSS klasa
• Example: ngClass
• Direktna primjena stilova
• Strukturne direktive
• Predložak za uslovno izvršenje
• Example: ngIf
• Petlja koristeći ngFor
• ngZa lokalne varijable
• Manipuliranje kolekcijom nprample – Brisanje stavke
• Praćenje stavki pomoću ngFor Zamjena elemenata sa ngSwitch elementima grupisanja
• Sažetak varijable reference šablona

Poglavlje 5. Komponentna komunikacija

• Osnove komunikacije
• Arhitektura protoka podataka
• Priprema djeteta za primanje podataka
• Pošalji podatke od roditelja
• Više o podešavanju svojstava
• Događaj pokretanja iz komponente
• @Output() Example – Podređena komponenta @Output() Example – Roditeljska komponenta
• Potpuno dvosmjerno uvezivanje
• Postavljanje dvosmjernog povezivanja podataka u roditelj
• Rezime

Poglavlje 6. Obrasci vođeni predloškom

• Obrasci vođeni šablonima
• Modul za uvoz obrazaca
• Osnovni pristup
• Postavljanje obrasca
• Dobivanje korisničkog unosa
• Izostavljanje atributa ngForm
• Inicijalizirajte obrazac
• Dvosmjerno povezivanje podataka
• Validacija obrasca
• Ugaoni validatori
• Prikaz stanja provjere pomoću klasa Dodatni tipovi unosa
• Potvrdni okviri
• Odaberite (padajući izbornik) polja
• Opcije renderiranja za polja za odabir (padajući izbornik) datuma
• Radio Buttons
• Rezime

Poglavlje 7. Reaktivni oblici

• Reactive Forms Overview
• The Building Blocks
• Import ReactiveFormsModule
• Konstruirajte obrazac
• Dizajnirajte predložak
• Dobivanje ulaznih vrijednosti
• Inicijalizacija polja za unos
• Postavljanje vrijednosti obrasca
• Pretplata na Promjene unosa
• Validacija
• Ugrađeni validatori
• Prikazuje grešku validacije
• Custom Validator
• Korištenje prilagođenog validatora
• Dostavljanje konfiguracije za prilagođeni validator
• FormArray – Dinamičko dodavanje ulaza
• FormArray – Klasa komponente
• FormArray – Predložak
• FormArray – Vrijednosti
• Podgrupe obrazaca – Klasa komponenti
• Sub FormGroups – HTML šablon
• Zašto koristiti podgrupe obrasca
• Rezime

Poglavlje 8. Usluge i ubacivanje zavisnosti

• Šta je usluga?
• Kreiranje osnovne usluge
• Uslužna klasa
• Šta je injekcija zavisnosti?
• Ubacivanje instance usluge
• Injektori
• Hijerarhija injektora
• Registracija usluge pomoću Root Injector-a
• Registracija usluge sa injektorom komponente
• Registrujte uslugu sa injektorom modula karakteristika
• Gdje registrirati uslugu?
• Injekcija zavisnosti u druge artefakte koji pružaju alternativnu implementaciju Injekcija zavisnosti i @Host
• Injekcija zavisnosti i @Opcionalno
• Rezime

Poglavlje 9. HTTP klijent

• Angular HT TP klijent
• Korištenje HT TP klijenta – Gotovoview
• Uvoz HttpClientModule
• Usluga koristeći HttpClient
• Izrada GET zahtjeva
• Šta radi objekat koji se može posmatrati?
• Korištenje usluge u komponenti
• Rukovanje greškama u komponenti klijenta PeopleService
• Prilagođavanje objekta Error
• Izrada POST zahtjeva
• Izrada PUT zahtjeva
• Podnošenje zahtjeva za DELETE

Poglavlje 10. Cijevi i formatiranje podataka

• Šta su cijevi?
• Ugradne cijevi
• Korištenje cijevi u HTML Template Chaining Pipes
• Internacionalizirane cijevi (i18n) Učitavanje lokalnih podataka
• Datum Pipe
• Broj Pipe
• Currency Pipe
• Kreirajte prilagođenu cijev
• Custom Pipe Example
• Korištenje prilagođenih cijevi
• Korištenje cijevi sa ngFor
• Cijev za filter
• Kategorija cijevi: čista i nečista
• Rezime
• Pure Pipe Example
• Impure Pipe Example
• Rezime

Poglavlje 11. Uvod u aplikacije na jednoj stranici

• Šta je tradicionalna aplikacija za jednu stranicu (SPA). Web Aplikacija
• SPA Workflow
• Aplikacija za jednu stranicu Advantages HTML5 History API
• SPA izazovi
• Implementacija SPA koristeći Angular Summary

Poglavlje 12. Ugaoni komponentni ruter

• Komponentni ruter
• View Navigacija
• Angular Router API
• Kreiranje aplikacije s omogućenom ruterom
• Hosting usmjeranih komponenti
• Navigacija pomoću veza i dugmadi
• Programska navigacija
• Prenošenje parametara rute
• Navigacija pomoću parametara rute
• Dobivanje vrijednosti parametara rute
• Sinhrono preuzimanje parametra rute
• Asinkrono preuzimanje parametra rute
• Parametri upita
• Dostavljanje parametara upita
• Asinkrono preuzimanje parametara upita
• Problemi sa priručnikom URL unos i označavanje
• Rezime

Poglavlje 13. Napredni HTTP klijent

• Request Options
• Vraćanje HttpResponse objekta
• Postavljanje zaglavlja zahtjeva
• Kreiranje novih posmatrača
• Kreiranje jednostavnog uočljivog
• Opservable Constructor Method Opservable operatori
• Mape i filter operateri
• Operator flatMap().
• Operator tap().
• Zip() kombinator
• Keširanje HT TP odgovora
• Obavljanje uzastopnih HT TP poziva
• Obavljanje paralelnih poziva
• Prilagođavanje objekta greške sa catchError()
• Greška u cjevovodu
• Error Recovery
• Rezime

Poglavlje 14. Ugaoni moduli

• Zašto ugaoni moduli?
• Anatomija modula klase
• @NgModule Properties
• Feature Modules
• Example Struktura modula
• Kreirajte modul domene
• Kreirajte par modula za usmjeravanje/usmjeravanje
• Kreirajte servisni modul
• Kreiranje zajedničkih modula

Poglavlje 15. Napredno rutiranje

• Funkcijski modul omogućen za rutiranje
• Korištenje funkcijskog modula
• Lazy loading the Feature Module
• Kreiranje veza za komponente funkcionalnog modula
• Više o Lazy Loading
• Predučitavanje modula
• Zadana ruta
• Putanja zamjenske rute
• preusmjeriti na
• Child Routes
• Definiranje dječjih ruta
• za dječje rute
• Linkovi za dječje rute
• Navigation Guards
• Kreiranje Guard implementacija
• Korištenje stražara na ruti
• Rezime

Poglavlje 16. Unit Testing Angular aplikacije

• Unit Testing Angular Artefacts
• Alati za testiranje
• Tipični koraci testiranja
• Rezultati testa
• Jasmine Test Suites
• Specifikacije jasmina (jedinični testovi)
• Očekivanja (tvrdnje)
• Matchers
• ExampLes Using Matchers
• Korištenje svojstva not
• Postavljanje i rastavljanje u paketima za testiranje jedinica
• Example od prijeEach i afterEach funkcija
• Ugaoni test modul
• Example Kutni testni modul
• Testiranje usluge
• Ubacivanje instance usluge
• Testirajte sinhroni metod
• Testirajte asinhroni metod
• Korištenje Mock HT TP klijenta
• Isporuka konzerviranog odgovora
• Testiranje komponente
• Modul za testiranje komponenti
• Kreiranje instance komponente
• Klasa ComponentFixture
• Testovi osnovnih komponenti
• Klasa DebugElement
• Simulacija korisničke interakcije
• Rezime

Poglavlje 17. Otklanjanje grešaka

• Gotovoview Angular Debugging
• Viewunos TypeScript koda u program za ispravljanje pogrešaka
• Korištenje ključne riječi za otklanjanje pogrešaka
• Debug Logging
• Šta je Angular DevTools?
• Korištenje Angular DevTools
• Angular DevTools – Struktura komponenti
• Angular DevTools – Izvršenje otkrivanja promjena
• Hvatanje sintaksičkih grešaka
• Rezime

Lab Exercises

• Lab 1. Uvod u Angular
• Lab 2. Uvod u TypeScript
• Lab 3. Uvod u komponente
• Lab 4. Predložak komponente
• Lab 5. Kreirajte komponentu foto galerije
• Laboratorij 6. Obrazac vođen šablonom
• Laboratorij 7. Kreirajte obrazac za uređivanje
• Laboratorija 8. Reaktivni oblik
• Laboratorija 9. Razvijte uslugu
• Lab 10. Razvijte HT TP klijenta
• Laboratorija 11. Koristite cijevi
• Laboratorija 12. Osnovna aplikacija za jednu stranicu pomoću rutera Laboratorija 13. Izrada aplikacije za jednu stranicu (SPA)
• Lab 14. Napredni HT TP klijent
• Lab 15. Korištenje Angular Bootstrap-a
• Lab 16. Lazy Module Loading
• Lab 17. Napredno rutiranje
• Laboratorija 18. Jedinično testiranje
• Laboratorija 19. Otklanjanje grešaka u Angular aplikacijama

KOM JE KURS ZA?
Ovaj kurs je namijenjen svima koji trebaju naučiti osnove Angular 12 razvoja i primijeniti ih u kreiranju web aplikacije odmah. Također možemo isporučiti i prilagoditi ovaj kurs obuke za veće grupe – štedeći vaše vrijeme, novac i resurse.

PREDUVJETI
Web Iskustvo u razvoju pomoću HTML-a, CSS-a i JavaScript-a je potrebno da biste izvukli maksimum iz ovog Angular kursa. Poznavanje DOM pretraživača je takođe korisno. Prethodno Angular iskustvo, s AngularJS ili bilo kojom verzijom Angulara, nije potrebno.
https://www.lumifywork.com/en-au/courses/angular-12-programming/

Dokumenti / Resursi

LUMIFY WORK Angular 12 Programiranje [pdf] Korisnički priručnik Angular 12 Programiranje, Angular, 12 Programiranje, Programiranje

Reference

• Uputstvo za upotrebu