LUMIFY WORK Uputstvo za programiranje Angular 12

LUMIFY WORK Angular 12 Programming User Guide

LUMIFY WORK LOGO

LUMIFY WORK Angular 12 Programiranje

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

PDF thumbnailAngular 12 Programiranje
User Guide · Angular 12 Programming, Angular, 12 Programming, Programming

Postavite pitanje

Use this section to ask about setup, compatibility, troubleshooting, or anything missing from this manual.

Postavite pitanje

Ask about setup, compatibility, troubleshooting, or anything missing from this manual. Name and email are optional.