Modulbeschreibung

Web Engineering 1

ECTS-Credits:
4
Lernziele:

Das Modul vermittelt die Grundlagen, die für die Entwicklung von einfachen Webanwendungen benötigt werden, und betrachtet sowohl den für die Benutzer:innen sichtbaren Teil (das Frontend) als auch die Komponente, die auf dem Server ausgeführt wird (das Backend). Das Modul konzentriert sich auf die grundlegenden Technologien, auf denen die fortgeschrittenen Modulen des Web Engineering (Web Engineering 2 und Web Engineering 3) aufbauen.

Fachkompetenzen:

  • Sie können grundlegende Technologien zur Erstellung von Webanwendungen (Hypertext Markup Language (HTML), Cascading Stylesheets (CSS)) erklären und sie bei der Entwicklung einfacher Webanwendungen anwenden.
  • Sie können die Grundlagen der Barrierefreiheit im Web beschreiben und die Anforderungen an unterschiedliche Komponenten von Webanwendungen formulieren.
  • Sie können das Document Object Model (DOM) erklären und die entsprechenden Schnittstellen anwenden, um das DOM zu manipulieren und auf Eingaben und Events zu reagieren.
  • Sie können die Sprachmittel von JavaScript anwenden und eigene Funktionen implementieren.
  • Sie können die Struktur des Hypertext Transfer Protocol (HTTP) erklären und einen Webserver, der auf einfache HTTP-Anfragen reagiert implementieren.
  • Sie können das Konzept der asynchronen Programmierung mit Promises beschreiben und asynchrone Anfragen in JavaScript implementieren.
  • Sie können den HTML-, CSS- und JavaScript-Code manuell und mit entsprechenden Werkzeugen (z.B. Linter) analysieren und Verbesserungsvorschläge entwickeln und umsetzen.
  • Sie können die Grundlagen der Usability im Web beschreiben und bei der Analyse von Webseiten und anderen interaktiven Systemen anwenden.

Methodenkompetenzen:

  • Sie können Standards, Dokumentationen und Fachliteratur verwenden um Entwurfsentscheidungen zu treffen.
  • Sie können Code (z.B. HTML, CSS, Javascript) anhand von Richtlinien und Standards oder mit entsprechenden Werkzeugen analysieren und kritisch bewerten.
  • Sie können den inkrementellen Entwicklungsprozess einer Anwendung planen und reflektieren.

Sozial- und Selbstkompetenzen:

  • Sie können Ihren Lernprozess selbstständig planen und strukturieren.
  • Sie können konstruktives Feedback formulieren und Feedback konstruktiv entgegennehmen.
  • Sie können die Grenzen Ihres Wissens erkennen und sich selbstständig Fachliteratur aus dem Themengebiet der Vorlesung aneignen.
  • Sie können Fragen gemeinsam mit Mitstudierenden oder im Dialog mit der Lehrperson formulieren und klären.
  • Sie können sich in Bezug auf berufliche Frage- und Problemstellungen begründet eine eigene Meinung bilden und diese kommunizieren.

Kurse in diesem Modul

Web Engineering + Design 1:

Bestandteile des Frontends

HTML

  • Aufbau von HTML-Dateien
  • Bestandteile des HTML-Standards
  • Syntaktisch und semantisch korrektes HTML
  • Optimierung der Barrierefreiheit von HTML

 

CSS

  • Aufbau von CSS-Regeln
  • Einfache und komplexe Selektoren, Pseudo-Klassen und -Elemente
  • Spezifität von Selektoren
  • Flexbox

 

Javascript

  • Sprachmittel
  • Funktionen und Objekte

 

Document Object Model (DOM)

  • Ladezustand des DOM
  • Selektion von Elementen
  • Bearbeiten des DOM
  • Event-Handling

 

Komponenten des Backends und Kommunikation mit Backends

HTTP

  • Aufbau von Request und Response
  • HTTP-Methoden
  • Implementierung eines einfachen Webservers

 

REST

  • Grundprinzipien von REST
  • Eigenschaften von REST am Modell von Richardson
  • Repräsentation von Ressourcen
  • Dokumentation von Webservices

 

AJAX

  • Implementierung asynchroner Anfragen mit fetch
  • Umgang mit Promises (then/await)
  • Umgang mit langsamen und unzuverlässigen Backends

 

Grundlagen der Usability im Web

  • Motivation
  • Grundlegende Designprinzipien (Heuristiken, Gestaltgesetze, visuelles Design)
  • Barrierefreie Gestaltung
  • Usability-Tests
Vorlesung mit 2 Lektionen pro Woche
Uebung mit 2 Lektionen pro Woche
Disclaimer

Diese Beschreibung ist rechtlich nicht verbindlich! Weitere Informationen finden Sie in der detaillierten Modulbeschreibung.