Jetpack Compose for Web ist ein neues UI-Framework für die Webentwicklung

JetBrains bringt Jetpack Compose, Googles deklaratives Design-Framework für Android, ins Web. Es ist heute als Vorschau verfügbar.

In den letzten Jahren gab es einen ziemlich großen Schub für die plattformübergreifende Programmentwicklung. Frameworks wie React und Flutter wurden entwickelt, um Entwicklern die gemeinsame Nutzung einer einzigen Codebasis für Android, iOS, Desktop und sogar das Web zu ermöglichen. Sogar JetBrains, das Unternehmen hinter einigen der beliebtesten IDEs und der Programmiersprache Kotlin, hat an der plattformübergreifenden Entwicklung gearbeitet. Zuerst mit Kotlin Multiplatform, neuerdings aber auch mit Jetpack Compose.

Vor einiger Zeit portierte JetBrains Jetpack Compose, Googles deklaratives Design-Framework für Android. zum Desktop. Dies ermöglichte eine plattformübergreifende Desktop-Entwicklung auf Basis der JVM von Java. Mit Jetpack Compose können Sie aus einer einzigen Codebasis eine App für Android, macOS, Windows und sogar Linux erstellen. Aber neben iOS fehlt Compose eine ziemlich große Plattform: das Web.

Das wird sich jedoch bald ändern. JetBrains hat freigegeben was sie eine Technologievorschau von Jetpack Compose for Web nennen.

Nun ist Technology Preview im Grunde ein schicker Name für Pre-Alpha. Compose for Web ist noch lange nicht bereit für den Einsatz in der Produktion. Es gibt keine Tutorials, nur sehr wenig Dokumentation und die APIs sind bei weitem nicht vollständig. Lassen Sie uns nun sehen, was Compose for Web bisher bietet.

In der aktuellen Version gibt es zwei Möglichkeiten, in Compose for Web zu entwickeln: mithilfe der DOM-API oder mithilfe der vorhandenen Compose-Widgets wie „Spalte“ oder „Text“.

Wenn Sie die DOM-API verwenden, verfügen Sie über API-Namen, die die verschiedenen HTML-Elemente darstellen, z P, A, und so weiter. Der große Unterschied zwischen Compose und klassischem Kotlin JS besteht jedoch darin, dass Sie zustandsbasiertes deklaratives Design verwenden können. Diese Option scheint eine Art Brücke zwischen der klassischen Webentwicklung und der vollständig deklarativen UI-Entwicklung zu sein. Neben der Erstellung eines Layouts können Sie mit Compose for Web auch dynamische, zustandsbasierte Stylesheets erstellen.

Die zweite Option wird Android- und Compose-Entwicklern bekannter vorkommen. Es gibt vorgefertigte Komponenten wie Spalte, Zeile und Schieberegler, mit denen Sie eine Web-Benutzeroberfläche erstellen können. Im Moment sind diese noch nicht sehr vollständig und Stile und Optionen sind nicht vollständig implementiert. Aber es gibt uns zumindest eine Vorstellung davon, was JetBrains für Compose for Web bereithält.

Insgesamt gibt es im Moment nicht wirklich viel zu Compose for Web. Es ist immer noch in seinem sehr Anfangszeit. Aber es könnte viel für die Zukunft bedeuten. Persönlich hatte ich als Android-Entwickler Schwierigkeiten, mich mit browserbasierten Layout-Frameworks vertraut zu machen. Einfaches HTML und CSS können umständlich sein, und die Syntax von React und Flutter basiert immer noch auf dem HTML-Design.

Eine voll funktionsfähige, plattformübergreifende Designsprache, die nicht auf Webdesign-Prinzipien basiert, ist ziemlich aufregend. Während Jetpack Compose noch einen langen Weg vor sich hat, könnten die Pläne von JetBrains für die Zukunft des UI-Designs von großer Bedeutung sein.

Wenn Sie mehr über Compose for Web erfahren möchten, Schauen Sie sich die Ankündigung von JetBrains an. Wenn Sie daran interessiert sind, mit der aktuellen Implementierung herumzuspielen, Gehen Sie zum GitHub-Repository.