Schulung Geschäftsanwendungen mit HTML 5.x und JavaScript (oder TypeScript): Moderne Web 2.0-/HTML5-Browser-Webanwendungen und Mobilanwendungen entwickeln

Beschreibung/Inhalt

Egal, ob auf mobilen Geräten, in Web-Browsern oder auf Ihrem PC: HTML/HTML5 und JavaScript werden überall unterstützt. Dies ist auch der Grund dafür, warum gerade JavaScript in den letzten Jahren sehr populär geworden ist, zumal es den Einsatz derselben Code-Basis auf unterschiedlichen Plattformen erlaubt und somit dabei hilft, die Kosten bei der Entwicklung von Multi-Plattform-Anwendungen drastisch zu reduzieren. In dieser Schulung erfahren Sie, wie Sie diese Technologien nutzen und mit serverseitigen Frameworks (z.B. ASP.NET, node.js, PHP, Java oder Ruby-on-Rails) kombinieren.
- Dieses Schulungsmodul kann mit allen aktuellen TypeScript-Versionen (z.B. 5.3, 5.2, 5.1, 5.0) entsprechend Ihren Wünschen durchgeführt werden.
- Dieses Schulungsmodul kann mit allen aktuellen JavaScript-Versionen (z.B. 14.0, 13.0, 12.0, 11.0) entsprechend Ihren Wünschen durchgeführt werden.

Optional vorab: Basistechniken einer modernen Web- und Mobilanwendung (werden geschult, sofern noch nicht bekannt)

  • HTML5.x/CSS 3
  • JavaScript
  • Optional: TypeScript, Dart und CoffeeScript als Alternativen zu direkter JavaScript-Programmierung
  • APIs wie DHTML, DOM, AJAX
  • Webservices mit REST und JSON


  • Konzepte moderner Web-, Mobil- und Cross-Platform-Anwendung
  • Moderne Webarchitekturen

  • Single-Page-Web-Applications (SPAs) vs. Multi-Page-Web-Applications (MPAs)
    Server-Side-Pre-Rendering
    Aufbau von Client und Server
    Mobile Apps mit Webtechniken
    Cross-Platform-Apps mit Webtechniken
    Pattern für die Benutzeroberfläche (MVVM, MVC, MVP)
  • Kommunikation

  • REST-Kommunikation mit HTTP-Diensten/Web-APIs (XML, JSON)
    Benachrichtigungen/Push ("Echtzeitfähigkeit") mit Websockets
  • User Experience

  • Usability ähnlich wie bei Desktop-Anwendungen
    Responsive Web Design (RWD)
    Offline-Fähigkeit
    Progressive Web Apps (PWA)
    Progressive Enhancement

    Architektur einer modernen Web- und Mobilanwendung
  • Aufbau des Servers
  • Aufbau des Clients
  • Kommunikationsarten


  • Werkzeuge für moderne Web- und Mobilanwendung
  • 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

    Serverseitige API-Techniken für moderne Webanwendungen
  • HTTP APIs (WebAPIs)
  • OAS / Swagger
  • Open Data Protocol (Odata)
  • GraphQL


  • Serverseitige Frameworks zur einfachen Erstellung moderner Web- und Mobilanwendungen nach vorheriger Absprache mit dem Kunden, z.B.
  • Wahlweise ASP.NET u
  • Java
  • node.js
  • PHP
  • (andere auf Anfrage)


  • Clientseitige Frameworks zur einfachen Erstellung von Web 2.0-Anwendungen/SPA:
  • Überblick über CSS- und JavaScript-Frameworks


  • Vorstellung von Frameworks nach vorheriger Absprache mit dem Kunden, z.B.
  • Angular
  • React
  • Vue.JS
  • Svelte
  • jQuery
  • Hilfsbibliotheken: z.B. Datumsverarbeitung mit moment.js, Filtern/Sortieren mit underscore.js, Promises mit Q, Reactive Extensions for JavaScript (RxJS)
  • (andere auf Anfrage)


  • Design-Systemen nach vorheriger Absprache mit dem Kunden, z.B.
  • Twitter Bootstrap
  • Material Design
  • Tailwind
  • (andere auf Anfrage)


  • Sicherheit in modernen Webanwendungen
  • Angriffszenarien wie Cross-Site-Scripting (XSS)
  • Schutzmechanismen


  • Authentifizierung und Autorisierung in modernen Webanwendungen
  • Security für Webanwendungen und Services
  • Login mit Facebook, Google, Twitter, Microsoft Account & Co.
  • Single Sign-on
  • OAUTH 2.0/2.1 und OpenId Connect


  • Anwendungspraxis:
  • Single-Page-Web-Application erstellen
  • Mobile Webanwendungen erstellen
  • Hybrid-Anwendungen mit Responsive Web Design erstellen
  • Offlinefähige Webanwendungen erstellen
  • Push-Nachrichten empfangen
  • Hintergrund-Aufgaben mit Webworkern erstellen
  • Lokalisierung

  • 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