Yesterday I made a post on Reddit about my Spotify...

# kilua

[Shubham Singh]

Yesterday I made a post on Reddit about my Spotify Landing Page Clone:

https://www.reddit.com/r/Kotlin/s/kVBtwUVPuZ

And I got a comment that I don't have an answer to since I haven't used Kobweb yet. So if someone here has used both Kobweb and Kilua, could you please help me with the question asked in the attached image?

Basically, how is Kilua different from Kobweb?

[Phuc]

This: https://kotlinlang.slack.com/archives/C01F2HV7868/p1734156178685089

[Robert Jaros]

With Kobweb You Have To Write All HTML Tags Uppercase ;-)

[Shubham Singh]

Haha 😂

[Phuc]

yes, because the tags are Composables?

[Phuc]

I tried Kobweb with this simple landing page: https://www.bumbii.ai/english/

[Phuc]

so far I think it’s good, especially for people from mobile development like me 🙂

[Robert Jaros]

And seriously, both Kobweb and Kilua do the same thing - you use composable functions to create HTML elements with attributes and styles. Just the API is different. Kobweb uses approach a bit familiar to Android devs (with objects like Box, Column, Row or Modifier). It also adopts Compose HTML design (uppercase function names, AttrsBuilderContext and attrs =). And it packs everything with CLI tool and some nice features like static export, fullstack routes, web workers or markdown. I think Kilua should be easier for web developers (like me). The API is simpler. Most of the time you use composable function calls with simple parameters for everything. You work directly with CSS flexbox / CSS grid for more complex layouts.

[Shubham Singh]

Let me know if it exists in Kobweb but I feel that Kilua's API provides a generic non-typesafe access to JS properties as well.

Like if something isn't covered by the type-safe Kilua API, it's not really stopping you from accessing those web properties/APIs you want to use

[Shubham Singh]

Meaning that Kilua is much more of an enabler rather than a hurdle in someone's way

[Robert Jaros]

I haven't used Kobweb myself, so I'm not an expert. But even after reading the docs a few times I just still don't understand some concepts like Silk.

[Shubham Singh]

Gotcha
Thank you both Robert and Phuc 🙌 this helps greatly

[Robert Jaros]

You can access non-typesafe properties as well in Kobweb: https://github.com/varabyte/kobweb?tab=readme-ov-file#attrsmodifier-and-stylemodifier

[Shubham Singh]

Oh okay
In that case I agree with your first point

It's just a preference difference, both frameworks provide the same thing, one is more tilted towards bringing Android Devs onboard, and the other is tilted towards attracting Web Devs to Kotlin.

[Robert Jaros]

But of course the API design in not the only difference between Kobweb and Kilua.

[Robert Jaros]

While Kobweb is focused on building HTML, Kilua also gives you some additional, advanced components. It's perfect for building complex web applications (with lot's of forms, dialogs and tables). This is something still not highlighted enough, because the docs are not ready and the examples are not covering that aspect.

[Shubham Singh]

Understood
Let me know if I can help out with something
Happy to be useful 🙌

[Robert Jaros]

Thanks 🙂 The truth is your spotify example is probably more appealing to potential users, even though it doesn't use any components 🙂 Form components and inputs are boring and ugly 😉 They are only appreciated when your customer asks you to add the hundredth dialog window to your application 🙂

[Phuc]

I’ll try Kobweb more and we can come back here after some time 🙂

[Phuc]

I’m not sure but I think Kobweb is also planned for complex app

[Phuc]

not just simple landing page like mine

[Robert Jaros]

I'm sure it is. It just won't let you use an inline calendar date picker out of the box. Kilua does.

[Robert Jaros]

I've answered the Reddit question as well with a short summary.

[Shubham Singh]

Awesome! Thank you 🙌

[David Herman]

> I haven't used Kobweb myself, so I'm not an expert. But even after reading the docs a few times I just still don't understand some concepts like Silk.
Kobweb core is the navigation / routing part. It introduces a fork of the Modifier concept from Jetpack Compose, and annotations like @Page (for frontend pages) and @Api (for backend API routes).

Silk is the UI layer. It includes a growing list of widgets, color mode support, and CSS styling blocks.

Perhaps the best analogy is that Kobweb is like NextJS and Silk is somethling like Chakra UI (but with an API inspired by Jetpack Compose). You can definitely use Kobweb without Silk.

I probably could have chosen to not release both a UI layer AND a core layer and saved myself a bunch of time, but I think the "batteries included" approach is something that helped make Kobweb easier to pick up for new users who just wanted to get started ASAP.

Hope that clarifies things. If you confirm that makes sense, I'll revisit the docs and see if I can explain this earlier.

[David Herman]

Kilua also gives you some additional, advanced components.

Silk is still woefully underdeveloped in the components department. Hopefully we see an acceleration of development in that area early next year. You can see the list of components offered by Chakra UI (https://v2.chakra-ui.com/docs/components) and assume that many of these will make their way into Silk eventually.

[David Herman]

Oh and congrats @Shubham Singh on your Spotify clone. It looks like a clean, beautiful project.

[Robert Jaros]

@David Herman Thanks for explanation!

[Shubham Singh]

Oh and congrats @Shubham Singh on your Spotify clone. It looks like a clean, beautiful project.

Thanks @David Herman, currently I'm attempting to recreate the YouTube web app using Kobweb to learn more about the framework 😄

[David Herman]

Wow @Shubham Singh I love the way you approach learning!

Feel free to ping #C04RTD72RQ8, my discord, or DM me if you have any questions or feedback. ✌️