Oberflächen umsetzen mit Frameworks und Bibliotheken

Web-Oberflächen trennen Struktur, Darstellung und Verhalten: HTML beschreibt mit semantischen Elementen wie nav, main und button, was ein Inhalt ist; CSS legt Layout und Aussehen fest, etwa mit Flexbox und Grid; JavaScript reagiert auf Ereignisse und lädt Daten nach. Frameworks wie React, Angular oder Vue (nur Beispiele) bauen die Oberfläche aus wiederverwendbaren Komponenten, die ihren Zustand verwalten und die Anzeige bei Änderungen selbst aktualisieren. Architekturmuster wie MVC oder MVVM trennen Darstellung, Steuerung und Daten.

Daten kommen meist über eine REST-Schnittstelle als JSON. Der Aufruf läuft asynchron, etwa mit fetch und async/await: Die Oberfläche zeigt eine Ladeanzeige, prüft den Statuscode, wertet die Antwort aus und meldet Fehler verständlich. Eingaben prüfst du im Browser für schnelle Rückmeldung und auf dem Server für die Sicherheit, denn alles im Browser lässt sich umgehen. Benutzertexte gibst du immer als Text aus und nie als HTML, sonst droht Cross-Site-Scripting.

Der Rahmenlehrplan verlangt, vorhandene Bibliotheken und Module zu nutzen. Dazu gehört ein Paketmanager, der Abhängigkeiten mit Versionsangaben verwaltet. Nach Semantic Versioning bedeutet MAJOR.MINOR.PATCH: inkompatible Änderung, neue Funktion, Fehlerkorrektur. Prüfe vor dem Einbinden die Lizenz: Freizügige Lizenzen wie MIT, BSD oder Apache 2.0 erlauben den Einsatz in geschlossener Software, die GPL verlangt bei Weitergabe die Offenlegung abgeleiteter Werke.