Hi, I'm planning to start a small company-internal...

# javascript

[Piotr Krzemiński]

Hi, I'm planning to start a small company-internal project and I'm hesitating between Kotlin/JS with React and Compose for Web. I'm curious about your hints and opinion. I have some experience with Kotlin/JS + React + MUI and I didn't fully like how the MUI wrappers work. I mean, it's getting better over time, but I thought that Compose + Material UI theme would give a more Kotlin-native feeling, without the JS part leaking into the code. On the other hand, React seems a bit more mature?

[Vampire]

There are also some Kotlin-only web frameworks you could consider, but I don't have them in mind right now.

[Piotr Krzemiński]

KVision e. g. - I recall it, but I'd like to use something backed by a company, not a single person + community, and generally more recognizable. Hence my choices are Compose or React

[ashmelev]

I have used KVision for several internal projects with good success. Yes, @Robert Jaros is the primary support, but he's super-responsive and very helpful. Also, the back-end code is all standard host-side programming (I use the Spring back-end, but VertX and JTor and others are supported). The front-end code generation is pretty standard JS/React/Redux as well (though codes in Kotlin, of course). I made some quick mods to by Gradle script to package the front-end inside the SpringBoot deployment and the whole package compiles to a Docker container (using Google Jib) very cleanly for Kubernetes deployment.

It's a pretty solid solution, actually

[Big Chungus]

CfW does not have material support so all you get us raw dom element management. Styling is entirely up to you. Think of it like react without mui.

[Big Chungus]

There's bootstrap-compose and my own kmdc to help CfW with that, but both are experimental

[Big Chungus]

Doodle is another kotlin-first web framework

[Big Chungus]

If I were you I'd go with kjs shared business logic lib and ui written in regular ts mui.

[Piotr Krzemiński]

CfW does not have material support

that’s weird, I’m browsing this example and true it’s configured only for Android and desktop, but I see api(compose.material) in dependencies for commonMain , MaterialTheme configured, and the desktop version running fine and displaying Material components - isn’t it easily portable to web target? what stops us from using Material components on web, what's the technical limitation here?

[Piotr Krzemiński]

Also @Big Chungus doesn't https://github.com/mpetuska/kmdc support primarily Web? I'm confused reading that it's for CfD

[Piotr Krzemiński]

We could use some single place with a summary of what's the state of Compose support 😆 really hard to wrap my head around various nuances

[Big Chungus]

Kmdc is for CfW (made a mistake earlier). Also that material artefact is not available for js target.

[Big Chungus]

There is some work being done on canvas based components that would bring material libs to the web as well

[Piotr Krzemiński]

do you know any YouTrack ticket about Material support for CfW?

self-answer:
• https://github.com/JetBrains/compose-jb/issues/1369
• https://github.com/JetBrains/compose-jb/issues/1257

[Big Chungus]

Search for wasm, skia or canvas in #compose-web to surface some examples. It's experimental still, but works already.

[Big Chungus]

Also don't confuse it with already deprecated dom material widgets that we had initially

[Piotr Krzemiński]

FTR, here's an interesting thread related to Compose on Canvas/Skia/Wasm

[Mike Dawson]

I actually quite like the way the Kotlin/JS MUI wrapper looks. I think it looks quite similar to Jetpack compose on Android. I spent a bit of time understanding React hooks and came up with a few hooks for using multiplatform ViewModels:

val PersonDetailScreen = FC<Props>() {
    val di = useContext(DIContext)

    val viewModel = useViewModel { DummyViewModel() }

    val dummyUiState: DummyUiState by viewModel.uiState.collectAsState(DummyUiState())

    Typography {
        + "Hello ${dummyUiState.person.firstNames}"
    }

}

[Mike Dawson]

Kotlin MUI showcase was a good starting point: https://github.com/karakum-team/kotlin-mui-showcase . I have also suggested adding a JS/React model to the multiplatform Kamp Kit example ( https://github.com/touchlab/KaMPKit/issues/269 )