Jetpack Compose for Web is een nieuw UI-framework voor webontwikkeling

JetBrains brengt Jetpack Compose, het declaratieve ontwerpframework van Google voor Android, naar het internet. Het is vandaag beschikbaar als preview.

De afgelopen jaren is er een behoorlijk grote impuls geweest voor platformonafhankelijke programma-ontwikkeling. Frameworks zoals React en Flutter zijn gemaakt om ontwikkelaars in staat te stellen één enkele codebase te delen op Android, iOS, desktop en zelfs op internet. Zelfs JetBrains, het bedrijf achter enkele van de populairste IDE's en de programmeertaal Kotlin, heeft gewerkt aan platformonafhankelijke ontwikkeling. Eerst met Kotlin Multiplatform maar recenter met Jetpack Compose.

Een tijdje geleden porteerde JetBrains Jetpack Compose, het declaratieve ontwerpframework van Google voor Android, naar bureaublad. Dit maakte platformonafhankelijke desktopontwikkeling mogelijk, gebaseerd op Java's JVM. Met Jetpack Compose kun je een app maken voor Android, macOS, Windows en zelfs Linux, allemaal vanuit één codebase. Maar naast iOS ontbreekt er nog een behoorlijk groot platform in Compose: het web.

Dat gaat echter veranderen. JetBrains heeft uitgegeven wat zij een Technology Preview van Jetpack Compose for Web noemen.

Nu is Technology Preview eigenlijk een mooie naam voor pre-alpha. Compose for Web is nog lang niet klaar om in productie te worden gebruikt. Er zijn geen tutorials, heel weinig documentatie en de API's zijn nog lang niet compleet. Dat gezegd hebbende, laten we eens kijken wat Compose for Web tot nu toe te bieden heeft.

In de huidige versie zijn er twee manieren waarop u kunt ontwikkelen in Compose for Web: met behulp van de DOM API of met behulp van de bestaande Compose-widgets, zoals Kolom of Tekst.

Als u de DOM API gebruikt, heeft u API-namen die de verschillende HTML-elementen vertegenwoordigen, zoals P, A, enzovoort. Het grote verschil tussen Compose en klassieke Kotlin JS is echter dat je op staten gebaseerd declaratief ontwerp kunt gebruiken. Deze optie lijkt een beetje een brug tussen klassieke webontwikkeling en volledige declaratieve UI-ontwikkeling. Naast het maken van een lay-out kunt u met Compose for Web ook dynamische, op status gebaseerde stylesheets maken.

De tweede optie zal er bekender uitzien voor Android- en Compose-ontwikkelaars. Er zijn kant-en-klare componenten, zoals Kolom, Rij en Schuifregelaar, die u kunt gebruiken om een ​​webinterface te bouwen. Op dit moment zijn deze niet erg compleet en zijn stijlen en opties niet volledig geïmplementeerd. Maar het geeft ons in ieder geval een idee van wat JetBrains in petto heeft voor Compose for Web.

Over het geheel genomen is er op dit moment niet echt veel aan Compose for Web. Het zit nog steeds in zijn erg Vroeger. Maar het kan veel betekenen voor de toekomst. Persoonlijk heb ik als Android-ontwikkelaar moeite gehad om in browsergebaseerde lay-outframeworks te komen. Basis-HTML en CSS kunnen onhandig zijn, en de syntaxis van React en Flutter zijn nog steeds gebaseerd op HTML-ontwerp.

Een volledig uitgeruste, platformonafhankelijke ontwerptaal die niet gebaseerd is op webontwerpprincipes is behoorlijk spannend. Hoewel Jetpack Compose nog een lange weg te gaan heeft, kan wat JetBrains heeft gepland veel betekenen voor de toekomst van UI-ontwerp.

Als u meer wilt weten over Compose for Web, bekijk de aankondiging van JetBrains. Als je geïnteresseerd bent om met de huidige implementatie te spelen, ga naar de GitHub-repository.