Schulung Umstieg von .NET-Desktop-Entwicklung (WPF/Windows Forms) auf Webentwicklung (ASP.NET/ASP.NET Core + JavaScript/TypeScript mit Webframeworks wie Angular, Vue.js oder React)

Beschreibung/Inhalt

HTML und CSS (ca. 1 Tag)
Web-Konzepte

  • Webbrowser und Webserver
  • HTTP
  • Zustandslosigkeit
  • Herausforderungen/Fallstricke bei der Entwicklung von Webanwendungen


  • Hypertext Markup Language 5.x (HTML 5.x)
  • HTML-Konzepte
  • HTML-Versionen
  • Regeln für HTML-Tags und HTML-Attribute
  • Die wichtigsten HTML-Tags
  • HTML-Werkzeuge

  • * Editoren
    * Validatoren
    * Webbrowser
  • Praxis: HTML-Dokumente erstellen


  • Cascading Style Sheets (CSS) Version 3 (CSS3)
  • CSS-Konzepte
  • CSS-Versionen
  • CSS-Anweisung (CSS Rules)
  • CSS-Selektoren
  • CSS-Klassen
  • Layout mit Flexbox
  • CSS-Werkzeuge

  • * Editoren
    * Validatoren
    * Webbrowser
  • Praxis: HTML-Dokumente mit CSS formatieren
  • CSS-Hacks
  • CSS-Abstraktionen wie LESS, SASS und Bootstrap


  • Webserverprogrammierung mit ASP.NET oder ASP.NET Core (ca. 3 Tage)
  • Konzepte ASP.NET und ASP.NET Core
  • Unterschiede zwischen ASP.NET und ASP.NET Core
  • Werkzeuge


  • Server-Side-Rendering (SSR) mit ASP.NET (Core)
  • ASP.NET (Core) MVC: Model, View, Controller, Actions
  • ASP.NET Core Razor Pages: View und PageModel
  • Razor-Syntax
  • Routing
  • Formulare/Masken
  • Parameterbindung und Validierung
  • Modulariersierung und Wiederverwendbarkeit (HTML Helper, Tag Helper, Partielle Views, View Components, Areas usw).
  • Sicherheit: Authentifizierung/Autorisierung/Benutzerverwaltung
  • Caching
  • Fehlerbehandlung
  • Unit Tests und UI-Tests


  • REST-Dienste/HTTP Services/Microservices mit ASP.NET (Core) WebAPI
  • Controller und Actions
  • Datenformate
  • Parameterübergabe
  • Routing
  • Kontrolle über HTTP-Nachrichten
  • Fehlerbehandlung
  • Hilfeseiten
  • Ablaufverfolgung (Tracing)
  • WebAPIs testen mit HTTP-Test-Werkzeugen wie Postman und Fiddler
  • Datenbankzugriffe


  • Deployment
  • Konfigurationsdaten
  • Lokale und entfernte Internet Information Services (IIS)
  • Deployment über Fileshares, FTP und MSDeploy/Webdeploy
  • Deployment in Azure als Azure WebApps oder Azure Cloud Service
  • Optional: Deployment in Docker-Container
  • Optional: Deployment in andere Webserver wie nginx oder Apache
  • Optiional: Self-Hosting


  • Webclientprogrammierung mit ASP.NET Core Blazor (ca. 3 Tage)
    Optional: Einführung in die notwendigen Grundlagen von .NET und C# sowie HTML, CSS und JavaScript/TypeScript

    Blazor-Arten: Architektur, Vor- und Nachteile
  • Blazor Server Side Rendering (Blazor SSR)
  • Blazor Server (Server Side Blazor)
  • Blazor Webassembly (Client Side Blazor)
  • Blazor Web Apps (Blazor United)
  • Blazor Hybrid mit Blazor Desktop und Blazor MAUI


  • Basistechniken von ASP.NET Core Blazor
  • .NET
  • WebAssembly (WASM)
  • ASP.NET SignalR
  • DOM und virtual DOM


  • Werkzeuge für Blazor
  • .NET SDK/.NET CLI
  • Visual Studio
  • optional: Visual Studio Code
  • Projektvorlagen


  • Webanwendungen mit Blazor
  • Projekte und Webseiten anlegen
  • Razor Components
  • Templates mit HTML, CSS und Razor-Syntax
  • Code-Behind-Dateien (Trennung von Layout und Logik)
  • Datenbindung und Anpassung der Datenbindung
  • Ereignisse
  • Zustandsverwaltung
  • Lebenszyklus-Methoden
  • Routing/Navigation im Browser
  • Layoutvorlagen (Masterpages)
  • Dependency Injection


  • Kommunikation und Datenbankanbindung
  • REST APIs aufrufen mit HttpClient und JSON-Serialisierung
  • Google RPC-Dienste aufrufen
  • Bidirektionale Kommunikation / Echtzeitanwendungen mit ASP.NET Core SignalR
  • Abruf und Änderung von Daten aus SQL-Datenbanken mit Entity Framework Core


  • JavaScript-Interoperabilität
  • Aufruf von JavaScript aus .NET
  • Aufruf von .NET aus JavaScript
  • Einbindung bestehender JavaScript-Bibliotheken


  • Aufbauwissen
  • Wiederwendbare Bibliotheken (Component Library/Component Packages/Razor Class Libraries sowie .NET Standard-Bibliotheken)
  • Eigene Basisklassen für Blazor-Pages
  • Realisierung von Schnittstellen wie Idisposable
  • Verwendung von Timern
  • Triggern von UI-Aktualisierungen
  • Local Browser Storage
  • Authentifizierung und Autorisierung
  • Deployment


  • Optional: Profiwissen
  • Templated Components
  • Leistungsoptimierung/Performance Tuning
  • Testen von Blazor-Anwendungen (Unit Test, Integrationstests, Razor Component Tests mit bUnit, UI Tests)


  • Optional: Blazor Hybrid (Blazor Desktop/Blazor MAUI)
  • Einbetten von Blazor-Anwendungen in Windows Forms und/oder WPF und/oder .NET MAUI
  • Plattformspezifischer Code
  • Shared State
  • Deployment


  • Optional: Erweiterungen
  • Überblick über die verfügbaren Blazor-Erweiterungen (Community und Drittanbieter)
  • Optional: Besprechung ausgewählter Erweiterungen (nach Absprache)


  • Optional: WebAssembly außerhalb von Blazor

    Webclientprogrammierung mit JavaScript/TypeScript (ca. 2 Tage)
    # Die Skriptsprache JavaScript
  • Einsatzgebiete von JavaScript (Browser, Server, Cloud, Konsole, Anwendungserweiterungen)
  • Entwicklungsumgebungen für JavaScript
  • Grundkonzepte: Sprachmerkmale und Paradigmen in JavaScript
  • Unterschiede zu C#/C++/Visual Basic/Java u.a.
  • Datentypen, Literale, Variablen, Konstanten, Gültigkeitsbereiche
  • var vs. let vs. const
  • Template Strings
  • Ermittlung von Typen und Typkonvertierung
  • Kontrollstrukturen (Schleifen, Bedingungen etc.)
  • Truthy und Falsy
  • Booleans, truthy und falsy und der Vergleichsoperator
  • Funktionen, Parameter, Rückgabewerte
  • Lambdas (Arrow-Functions)
  • Funktionale Programmierung und Closures, Immediately Invoked Function Expression (IIFE)
  • Verwatung von Objekten und Objektmengen (Array, ArrayBuffer, Set, Map, WeakMap, WeakSet, Int8Array, Float64Array u.a.)
  • Iteration und Manipulation von Mengen, Spread-Operator
  • Fehlerbehandlung mit Try-Catch und Throw
  • Objektorientierte Programmierung mit Objektliteralen, Konstruktorfunktionen und Prototypen
  • Klassen, Konstruktoren, Properties und Vererbung
  • WeakRef, Proxy
  • Das Function-Objekt und this
  • Hilfsfunktionen und eingebaute Objekte (z.B. JSON, Math)
  • Asychrone Programmierung: async, await, Callback-Funktionen, Promises
  • Iteratoren und Generatoren
  • Destructuring
  • Module
  • Sonderfälle und besondere Konstrukte
  • JavaScript-Patterns und Best Practices
  • Codequalität und Lesbarkeit


  • # TypeScript als Erweiterung zu JavaScript
  • Unterschiede zwischen TypeScript und JavaScript
  • Gründe für die Verwendung von TypeScript
  • Transpilation nach JavaScript
  • Einrichtung der TypeScript-Entwicklungsumgebung
  • Konfiguration des TypeScript-Compilers (tsconfig.json)
  • DatenTypen in TypeScript, Statische Typisierung vs. dynamische Typisierung, Typaliase
  • Typisierte Funktionen und Parameter
  • Erweitertes Klassenbasiertes Programmieren: Klassen, Vererbung und Interfaces
  • Duck Typing
  • Generics
  • Ambiente Deklarationen
  • Dekoratoren (Annotationen)


  • # Best Practices für JavaScript und TypeScript
  • Zu vermeidende Sprachkonstrukte
  • Wartbaren Code schreiben
  • Coding Styles


  • # Werkzeuge
  • Web-Editoren wie Visual Studio, Visual Studio Code (VSCode), Webstorm/IntelliJ und Eclipse
  • Sinnvolle Erweiterungen des Webeditors (z.B. Plug-Ins für VSCode, Web Essentials für Visual Studio)
  • Aufbau eines Projekts/Projektstruktur mit Projekt-Scaffoldung-Werkzeugen, z.B. Yeoman oder Framework-spezifische CLI
  • Ausführungsumgebungen: node.js und Browser
  • Transpilation, z.B. von TypeScript zu JavaScript
  • Präprozessoren, z.B. SASS/SCSS/LESS/Stylus für CSS
  • Debugger z.B. in Visual Studio, VSCode, Webstorm, Eclipse
  • Debugger in Browsern z.B. in Chrome
  • Paketmanager, z.B. NPM, Yarn bower und nuget
  • Bundling, Lazy Loading und Hot Reloading mit Vite, Webpack, RequireJS oder SystemJS
  • Statische-Codeananalyse mit Lintern, z.B. ESLint, JSLint, JSHint, TSLint
  • Build-Automatisierung mit NPM-Skripten, gulp und grunt
  • Bundling mit Vite, Webpack, Parcel oder Browsify
  • Testautomatisierung, z.B. Jest, Mocha, Qunit, Cypress, Selenium, Nightwatch, WebdriverIO, Protractor, TestCafe, Playwright, Puppeteer, Chai, Expect.js, Code Coverage mit "Istanbul"
  • Continuous Integration / Continuous Delivery, z.B. mit GitHub, GitLab, Azure DevOps


  • Optional: Framework-spezifische CLI-Werkzeuge wie z.B. Angular CLI, Vue CLI, React CLI oder Cordova CLI

    Webclient-Frameworks
    Angular oder React oder ein anderes Framework nach Ihrer Wahl (z.B. Vue.js oder Svelte) (ca. 3 Tage)
  • Konzepte
  • Architektur
  • Projektaufbau
  • Komponentenbildung
  • Vorlagen/Templates
  • Datenbindung
  • Formulare/Masken/Validierung
  • Modularisierung/Services/Dependency Injection
  • Navigation/Routing
  • Steuerelemente
  • Werkzeuge
  • Fehlersuche
  • Auslieferung/Deployment
  • Weitere Konzepte des gewählten Frameworks
  • Tipps & Tricks

  • Dauer
    Auf Wunsch. Gerne geben wir Ihnen eine Empfehlung zur notwendigen Schulungsdauer, wenn Sie uns in der Anfrage Ihre Vorkenntnisse und Ziele nennen.
    Ort
    Online oder in Deutschland, Österreich und der Schweiz an Ihrem Firmensitz
    Schulungsdidaktik
    Nach Ihrer Wahl: Klassische Schulung mit PC-Übungen, reine Präsentation ohne PC-Übungen oder interaktiver Workshop mit Beratungsanteil