Webentwicklung mit JavaScript, HTML 5 und CSS

Ziele

In diesem Kurs erhalten die Teilnehmer eine Einführung in HTML5, CSS3 und JavaScript. Es werden grundlegende HTML5/CSS3/JavaScript-Programmierkenntnisse vermittelt. Zudem wir ein besonderes Augenmerk auf folgende Aspekte gelegt: Verwendung von HTML5/CSS3/JavaScript zur Implementierung von Programmierlogik, Definition und Verwendung von Variablen, Durchführung von Schleifen und Verzweigungen, Entwicklung von Benutzeroberflächen, Erfassung und Validierung von Benutzereingaben, Speicherung von Daten und Erstellung gut strukturierter Anwendungen.

Zielgruppe

Webentwickler, Webadministratoren, Webdesigner

Voraussetzungen

Grundkenntnisse in HTML und einer Programmierspreche sind von Vorteil

Agenda

Überblick über HTML und CSS

• Übersicht über HTML
• Überblick über CSS
• Erstellen einer Web Application mit Visual Studio

Erstellen und Gestalten von HTML-Seiten

• Erstellen einer HTML5-Seite
• Styling einer HTML5-Seite

Einführung in JavaScript

• Übersicht über JavaScript
• Einführung in das Document Object Model

Erstellen von Formularen zum Sammeln und Validieren von Benutzereingaben

• HTML5-Formulare erstellen
• Validierung von Benutzereingaben durch Verwendung von HTML5-Attributen
• Validierung von Benutzereingaben mit Hilfe von JavaScript

Kommunikation mit einem Remote-Server

• Asynchrone Programmierung in JavaScript
• Senden und Empfangen von Daten mit Hilfe des XMLHttpRequest-Objekts
• Senden und Empfangen von Daten mit Hilfe der Fetch-API

Styling von HTML5 mit CSS3

• Textgestaltung mit CSS3
• Styling-Blockelemente
• Pseudoklassen und Pseudo-Elemente
• Verbesserung der grafischen Effekte durch die Verwendung von CSS3

Erstellen von Objekten und Methoden mit Hilfe von JavaScript

• Schreiben von gut strukturiertem JavaScript-Code
• Benutzerdefinierte Objekte erstellen
• Objekte erweitern

Erstellen interaktiver Seiten mit HTML5 APIs

• Interaktion mit Dateien
• Einbinden von Multimedia
• Reaktion auf Browserposition und -kontext
• Debuggen und Profilen einer Webanwendung

Hinzufügen von Offline Support zu Web Applications

• Daten lokal lesen und schreiben
• Offline-Unterstützung über den Application Cache hinzufügen

Implementierung einer adaptiven Benutzeroberfläche

• Unterstützung mehrerer Formfaktoren
• Erstellen einer adaptiven Benutzeroberfläche

Erstellen erweiterter Grafiken

• Erstellen von interaktiven Grafiken mit SVG
• Zeichnen von Grafiken mit der Canvas-API

Benutzeroberfläche animieren

• CSS-Übergänge anwenden
• Transformationselemente
• CSS Keyframe-Animationen anwenden

Implementierung der Echtzeitkommunikation über Web-Sockets

• Einführung in die Web-Sockets
• Verwendung der WebSocket-API

Hintergrundverarbeitung mit Hilfe von Web Workern durchführen

• Verstehen von Web Workern
• Asynchrone Verarbeitung mit Hilfe von Web Workern durchführen

Verpacken von JavaScript für die Produktionsbereitstellung

• Transpiler und Modulbündelung verstehen
• Separate Pakete für die browserübergreifende Unterstützung erstellen