K9140 Angular 6 – SPA udvikling

Kurset kan køres både til Angular 6 og Angular 5| 4 | 2

ZoomTek afholder 2 kurser et grundlæggende og et udvidet kursus i Angular 6. Angular er en fuldstændig omskrivning i forhold til Angular 1.3 og 1.6. Arkitekturen er ændret fuldstændigt.

Angular 6 tilbyder bedre performance og skalérbarhed samt hurtigere udvikling. Angular 6 bygger på TypeScript og NodeJS.

Forudsætninger for Angular 6 kurset

Kurset forudsætter grundlæggende viden om html, css, javascript og webudvikling generelt. Har du stiftet bekendskab med første version af Angular er det fint, men da Angular 5 er fuldstængig anderledes er det ok, hvis du f.eks. blot er javascript-udvikler.

Kursusafholdelse fuld af Hands-on øvelser

Kurset kan med fordel afholdes som firmakursus. Kurset tilbydes også som 1-mandskursus/Online-kursus uden ekstrapris. Kurset er fuld af øvelser, hello world og a-ha oplevelser. Du får den nødvendige teori, men du får også koden til at virke på skærmen.

Kursusindhold

Kursuspensum kan variere afhængig af deltagernes niveau, behov og forudsætninger. Men grundstammen vil oftest være som vist her:

Modul 1: Introduktion til Angular

  • Forskelle på AngularJS 1.3/1.6 og Angular 6 og tidligere versioner
  • Buzzwords og Fokusområder
  • Fordele ved Angular
  • NodeJS contra Visual Studio
  • Editorer -> Visual Studio Code, Sublime
  • Grundlæggende arkitektur i Angular inkl. TypeScript
  • Hvorfor NodeJS -> herunder kompilering
  • Up and Running med NodeJS
  • Installation af NodeJS/npm
  • npm-kommandoer
  • Hentning af ressourcer på Github
  • Hello World – det første Component
  • Opsætning af Skabelon-bibliotek

 Modul 2 : CLI opsætning og brug

  • Installation af CLI
  • Brug af CLI – mest brugte ng kommandoer
  • Oprettelse af projekt med CLI
  • Oprettelse af komponent, directive m.m. med CLI

Modul 3 : TypeScript og Angular

  • Intro til TypeScript. Hvorfor – Hvordan?
  • TypeScript muliggør brug af klasser, interfaces, members, objekter og constructors, som det kendes fra f.eks. Java og C#.net – det kan udnyttes i Angular
  • Kompilering af TypeScript
  • Ikke browser-kompatibel
  • Hvad er TypeScript ikke?
  • Alternativer til TypeScript
  • TypeScript Tutorial

Modul 4: Angular Arkitektur, Komponenter (Components) og Begreber

  • Angular 2 er Component-opbygget. Hvad betyder det i praksis?
  • Det første Component. Hello World. Up-and-running.
  • Nødvendige begreber: Decorator Function, Component Artifact, Meta Objects, Fields, Selectors, templates
  • Intro til Providers og Directives
  • Sådan opbygges et Projekt
  • Gennemgang af Projekt-filer – herunder: cli-config, index.html, tsconfig.json, systemjs.config.js, package.json, typings.json samt main.ts i app-folderen
  • Rodkomponent (root component) contra subkomponent (sub component)
  • Import/eksport af components
  • Databinding 1way
  • Databinding 2way (mangler i Angular2 – og så alligevel ikke)

Modul 5: Providers, Services og Dependency Injection

  • Hvad er en Provider?
  • Findes der indbyggede Providers i Anguar 5 (oh yes, you bet…)
  • Hvad er en Service?
  • Hvordan laves en Service implementering?
  • Hvad er Dependency Injection (DI)?
  • Hvorfor er Dependency Injection smart?
  • Hvordan laves Dependency Injection i praksis?

Modul 6: Routing og HTTP

  • Hvad er Routing
  • Konfigurering af Routing
  • Nested Routing
  • Routing Parameters – parsing af url-data til child-komponent ved Routing
  • Import af nødvendige Providers
  • En lille advarsel. Måden at kode Routing på er forskellig i alfa, beta og gold release af Angular 2. Desværre er meget support på nettet skrevet til alfa og beta-versioner
  • HTTP i relation til Angular 6

Modul 7: Løsninger med mange komponenter

  • Property Binding
  • Event Binding
  • @Input, @Output, Eventemitter
  • @ViewChild

Modul 8: Directives

  • Brug af indbyggede directives som *ngIf, *ngIf-else, *For
  • Udvikling af egne directives: Hvorfor? Hvordan?
  • Components
  • Structural Directives. Hvad er det? og hvordan laves det?
  • Attribute Directives. Hvad er det? og hvordan laves det?
  • @Hostlistener
  • @Hostbinding

Modul 9: Template Syntaks

  • Events – herunder brug af $event
  • Hosts
  • Interpolation
  • ngModul på 3 måder

Modul 10: Angular Universal

Introduktion til Angular Universal. Ny feaure i Angular 4

Modul 11: Animation

Introduktion til Angular Animation. Omfattende mulighed for at lave grafiske effekter i Angular.

Modul 12: Formularer

  • Template-driven forms med FormsModule
  • Validering af felter – valid, dirty, touched
  • Validering pr. felt
  • Formatering af felter ud fra validering
  • Template Model Binding
  • Model-driven forms (Reactive forms)
  • FormGroup, FormControl
  • Brug af FieldSet
  • FormBuilder
  • Validering af Controls
  • Observables på felter

Modul 13: Unit Testing, LifeCycle

  • Unit Testing
  • Mocking
  • Simpelt Hello World eksempel
  • Fejlfinding i kode
  • Læse Debug filer
  • Best practice: hvilken browser giver mest hjælp m.m.
  • Et kig i Angular  API vedrørende Unit Testing

Modul 14 : Observables og Promises

  • Hvad er Observables
  • Subscribe i detaljer
  • Observables og fejlhåndtering
  • Unsubcribe()
  • Call Stacks og Event Tables
  • Design Pattern
  • Alternativer til Event Loop
  • RxJS – struktur og overblik
  • Forskelle på Observables og Promises

Modul 15: Projekter i Angular

  • Oprettelse af egne moduler til genbrug af bl.a. komponenter på tværs af projekter
  • Publisering af moduler – med npm
  • Import af moduler – med npm
  • Overførsel af udviklingsprojekt til produktionsmiljø

Modul 16: Angular API

  • Overblik – sådan finder du flere info

Modul 17: Opsamling – ekstraemner

  • Style Guide
  • LifeCycle Hooks
  • Polifills
  • User Input
  • Pipes
  • Google Developer Tools
  • Mere API Reference
  • Opbygning – best practice
  • Ressourcer og Next Step

Relaterede sider

Vejledning til WordPress for dummies Her er en WordPress vejledning i håndtering af sider. Kortfattet og for begyndere. ZoomTek udbyder WordPress hjemmesider for mindre virksomheder Lo...
Tekstforfatter – tekster til web og markedsf... Søger du en god, elegant tekstforfatter? Har du behov for tekster til din webside, brochurer eller øvrige salgsmateriale? ZoomTek udfærdiger levende o...
Billig hjemmeside ZoomTek giver mindre forretningsdrivende mulighed for en billig hjemmeside i et moderne design. Du kan vælge mellem 4 pakker: Grundpakken, Bronze-Pakk...
Training conducted in English | Kurser afholdt på ... Alle ZoomTek's kurser kan afholdes på engelsk uden ekstrapris. Mange større virksomheder har udenlandske medarbejdere, hvor et match af kursus kan vær...
Indsatspunkter under kursus    En levende instruktør med mange års konsulenterfaring. Glæde ved at undervise, dokumenterede evalueringer og en voksenpædagogisk uddannelse. Din i...
Praktisk Information om Kurset Når du skal på kursus, melder der sig ofte en række spørgsmål. Nedenfor findes praktisk information om kursusafholdelse. Du er også velkommen til at...
Download Center – download eksempelfiler og ... Nedenfor kan du downloade eksempelfiler i forskellige formater. Filerne indeholder testdata til undervisningsformål. Alle data er derfor fiktive... ...
ZoomTek Intranet Effektiv vidensdeling med intranet styrker konkurrenceevnen og bundlinjen. Vi tilbyder løsninger ned til kr. 10 pr. medarbejder pr. måned inkl. softwa...
ZoomTek’s profil – hvad gør ZoomTek an... Filosofien er simpel: Bedre kvalitet, erfarne konsulenter og større fleksibilitet... Løsningsorienterede kurser over certificeringsniveau Ønsker d...
Privatlivspolitik og Pligtaflevering Pligtaflevering ZoomTek udleverer kursusmateriale elektronisk til kursister. Materialer offentliggøres ikke elektronisk via internettet / hjemmeside. ...
Gratis Webinar efter kursus Få mere ud af dit kursus med en gratis opfølgning nogle uger efter kurset Gratis webinar på 2 timer efter kursus Fra 2018 vil du blive tilbudt et gr...
Web Service Kurser Vi har følgende Web Service kurser. Web Services involverer ofte mange grænseflader, platforme og programmer. Derfor kan kurserne også tilpasses, så d...
K9141 Django Web Framework Kursus Hvad er Django web framework ? Django er et high-level Python web framework. Som udvikler kan man hurtigt lave effektive og sikre websites, som er le...
K9139 Performance optimering af websider Website Performance er afgørende for Google Ranking Kunder foretrækker et hurtigt site - ellers er de videre, Google forventer hurtig performance - e...