Angular Grundlagen und Vertiefung für Enterprise Anwendungen

Seminarziel

Sie wissen, wie man mit Angular und TypeScript Anwendungen entwickelt und welche Besonderheiten dabei zu beachten sind. Sie lernen die Angular Grundkonzepte wie Component, Templating und Data Bindung kennen und anwenden. Mit Hilfe von Angular Dependency Injection entwickeln Sie Services und nutzen dabei REST-basierte Serverschnittstellen. Durch den Angular Router stellen Sie eine Navigation innerhalb Ihrer Anwendung zur Verfügung und nutzen Angular Formulare für die Eingabe von Daten.  Durch Testing wird Ihre Angular-Anwendung robust. 
Nach der Schulung wissen Sie, wie Sie Angular-Enterprise-Anwendungen erfolgreich  umsetzen. Sie wissen, wie Sie mit Modularisierung wiederverwendbaren Code erreichen und setzen erweitertes Routing und Zustandsverwaltung mit NgRx gekonnt ein. Sie wissen, wie Sie Unit- und E2E-Tests anwenden.

Inhalt

1. Tag: Auch separat buchbar als TypeScript Einführung und Grundlagen

• Einstieg in TypeScript
  • TypeScript Einführung und Überblick
  • TypeScript Möglichkeiten und Eigenschaften
  • TypeScript Syntax, Schlüsselworte und Code Hierarchie
  • TypeScript Werkzeuge: TypeScript Playground, Visual Studio, Web Essentials, Atom, Sublime Text, Eclipse, NodeJS
  • TypeScript Compiler
  • Hello TypeScript
• TypeScript Basics: Typen, Variablen, Funktionen
  • TypeScript Grammatik, Deklarationen und Annotationen
  • Typinferenz: Typableitung in TypeScript
  • Statische und dynamische Typisierung in TypeScript
  • Ambiente Deklarationen und Typ Definitions Files
  • "Any" und primitive Datentypen
  • Objekte in TypeScript
  • Funktionen in TypeScript
  • Arrow-Funktionen in TypeScript
  • Generics in TypeScript
• TypeScript Klassen und Schnittstellen
  • Klassen definieren
  • "Casting" - Typumwandlung
  • Datentypen erweitern
  • Schnittstellen verwenden
  • Mixins nutzen
• TypeScript Module
  • JavaScript und Module
  • Interne Module
    • Zugriffe auf interne Module und IIFE
    • Benannte Module
    • Interne Module erweitern
    • Interne Module organisieren
  • Externe Module
    • CommonJS
    • AMD
    • UMD
    • SystemJS
      
      

2.-3. Tag: Auch separat buchbar als Angular mit TypeScript Einführung und Grundlagen

• Angular - Einstieg
  • Voraussetzungen für die Entwicklung von Angular Applikationen
  • Werkzeuge, IDE's und Editoren
  • JavaScript, TypeScript, ES2015, Node.js®
  • Erstellen von Projekten mit dem Angular CLI
  • Alternativer Projekt-Setup mit Nx
• Angular - Components
  • Aufbau einer Komponente
  • Data Binding
  • Styling von Komponenten
  • Verschachtelte Components
  • Component Lifecycle
• Angular - Router, Navigation
  • Components als Routing-Ziel
  • Navigation aufbauen
  • Programmatisches Navigieren
• Angular - Templating
  • Interpolation Directive
  • Attribute Directives
  • Custom Directives
  • Styling mit ngStyle und ngClass
  • Bedingte Anzeige und Schleifen
  • Events auslösen
  • 2-way Data Binding
  • Components mit Parametern
  • Build-In Pipes 
  • Custom Pipes
• REST Client erstellen
  • Test Datenquelle einrichten
  • Dependency Injection 
  • Service erstellen 
  • Das HttpClientModule
  • RxJs / Observables verstehen
  • Error Handling
• Angular - Forms
  • Überblick Template-Driven Forms
  • Reactive Forms erstellen
  • Nutzen des FormBuilders
  • Formular-Validierung
• Code Qualität sichern
  • TSLint und ESLint in Projekten verwenden
  • Updates 
  • Documentation erstellen mit Compodoc
  • Übersicht über Frontendtests mit Protractor und Cypress
  • Übersicht Unit Tests mit Jasmine und Jest
    
    

4.-5. Tag: Auch separat buchbar als Angular Vertiefung für Enterprise Anwendungen

• Wiederverwendbarer Code
  • Feature Modules
  • Lazy Loading Modules
  • Shared Modules
  • Angular Libraries erstellen
• Routing Vertiefung
  • Routing in Feature Modules
  • Child Routes
  • Routen schützen mit Guards
  • Daten holen mit Resolver
• State Management mit NgRx
  • Konzept
  • Installation und Schematics
  • Debugging der DevTools Extension
  • Begriffserklärung: Store, Actions, Reducers und Selectors
  • Einführungsbeispiel
• Konzepte für Unit Tests für Angular
  • Überblick über Jasmine und Jest
  • Typischer Testaufbau
  • Mocken von Abhängigkeiten
• End-2-end Tests mit Protractor und Cypress
  • Überblick über die Werkzeuge
  • Vorgehensweise
  • Anbinden an eine Browser-Farm
• SEO optimierte Applikationen
  • Verwenden von Angular Universal
  • Voraussetzungen auf der Server-Seite
• Angular Applikationen als Progressive Web App (PWA)
  • Hinzufügen von PWA-Funktionalität
  • Kriterien für eine PWA
  • Konfiguration des Service Workers