Bootstrap Studio und React Studio im Test: UI-Designer für Web-Apps

Inhaltsverzeichnis

Entwickler, die vom Desktop ins Web wechseln, wundern sich gelegentlich, dass hier noch fast alles per Hand codiert wird. Ein Editor mit Syntaxhervorhebung genügt meist, um Anwendungen zu erstellen. Was zunächst reizvoll und nach ehrlicher Programmierung klingt, kann jedoch schnell nerven. Denn heutige Bedienoberflächen müssen intuitiv zu erschließen sein und ein ansprechendes Design bieten. Weil beides nicht einfach zu erreichen ist, trennen viele Softwarehäuser Entwicklung und Oberflächenerstellung personell. Die Werkzeugkiste des Designers ist natürlich eher mit Grafiktools als mit klassischen Editoren und integrierten Entwicklungsumgebungen gefüllt. Aber auch wenn eine Person beide Aufgaben erledigt, wünscht sie sich vielleicht Hilfe. Hier kommen grafische Designer wie Bootstrap Studio und React Studio ins Spiel.

Bei der Frontend-Entwicklung läuft die App im Browser, und hier handelt es sich bekanntermaßen auf unterster Ebene nach wie vor um ein Zusammenspiel aus HTML (Struktur), CSS (Design) und JavaScript (Interaktion). Ein entfernter Server liefert die Daten. Da komplexe Webanwendungen auf Wiederverwendung setzen, kommen auf allen Ebenen Bibliotheken und Frameworks zum Einsatz. Bibliotheken stellen diverse Funktionen bereit, zum Beispiel zum Gestalten des User Interface. Diese Komponenten lassen sich nach Belieben in eigenen Anwendungen verwenden und kombinieren. Frameworks geben der Applikation eine Struktur. Das kann eine Architektur für Komponenten oder die Art der Navigation zwischen den Elementen sein. Zum Auslagern spezialisierter Aufgaben wie der Oberflächengestaltung nutzen Frameworks Bibliotheken.

Für das Interagieren im Browser, das Reagieren auf Eingaben, das Abrufen und Verarbeiten von Daten, das Anzeigen dynamisch generierter Daten und das Abspielen von Animationen kommt meist JavaScript zum Einsatz. Das Zusammenwirken dieser Komponenten für die clientseitige Verarbeitung zeigt die folgende Abbildung.

Das war die Leseprobe unseres heise-Plus-Artikels "Bootstrap Studio und React Studio im Test: UI-Designer für Web-Apps". Mit einem heise-Plus-Abo können sie den ganzen Artikel lesen und anhören.