Kilua

Kilua - @Composable web framework for Kotlin/Wasm and Kotlin/JS

Kilua is an open source web framework for Kotlin, based on Compose Multiplatform runtime. It allows you to create declarative UI components and manage their state. Kilua renders to plain HTML DOM (not canvas) and supports both Kotlin/Wasm and Kotlin/JS targets. It provides a lot of ready to use components. It's the only Kotlin UI framework with full support for true SSR (Server-Side Rendering).

GitHub

Current version: 0.0.17

class App : Application() {
    override fun start() {
        root("root") {
            var state by remember { mutableStateOf("Hello, world!") }

            div {
                +state
            }
            button("Add an exclamation mark") {
                onClick {
                    state += "!"
                }
            }
        }
    }
}

fun main() {
    startApplication(::App)
}

Features

Use powerful Compose programming model and state management to develop web applications.
Choose from the wide range of ready to use components and form inputs.
Easily style your application using Tailwindcss or Bootstrap, with built-in support for dark mode.
Enhance user experience with lazy layouts, svg graphics and masked inputs.
Use built-in router for navigation, HTTP client for API calls and markdown parser to display your data.
Compile the same application code for Kotlin/Wasm or Kotlin/JS targets.
Create fullstack applications with a companion Kilua RPC library supporting Ktor, Spring Boot, Micronaut, Javalin, Jooby and Vert.x servers.
Translate your application to other languages with Gettext - one of the most widely used tool for i18n.
Deploy your application with full SSR for better SEO performance and user experience.
Export your application as a set of static HTML files for more affordable hosting solutions.

Learning

The official guide is published at https://kilua.gitbook.io/kilua-guide. It's still incomplete but already contains a lot of useful information.
Current API documentation is published at https://rjaros.github.io/kilua/api/.
Different example applications can be found in the examples directory.
Check SSR examples to see how to initialize Server-Side Rendering in different web servers.
The fullstack example shows how to create a fullstack application with Ktor web server and how to use different fullstack components.
Be sure to check out the realworld example - a fully fledged fullstack application based on the RealWorld project specification, supporting CRUD operations, authentication, routing, pagination, SSR and more.
This website is also a Kilua application fully designed with Tailwindcss. The primary version is published as exported static site on GitHub Pages. The secondary version is powered by a Ktor server with full SSR, running as GraalVM native image in a Docker container published to GitHub packages and hosted on Render with a free plan. You can check this version at https://ssr.kilua.dev/ (it may require some time to activate). The full source code, including GitHub Actions workflow is available at https://github.com/rjaros/kilua-dev.

Server-Side Rendering

Kilua is the first Kotlin/Wasm and Kotlin/JS web framework supporting true Server-Side Rendering. SSR is a crucial concept in modern web development that enhances user experience and boosts SEO performance. Kilua SSR support is based on the possibility to run exactly the same application code both in the browser and in NodeJs environment. What's more, you can easily use WASM compilation target for much better performance.

SSR features

Preparing the application for SSR is as easy as changing the router class.
Ability to use external API calls and fullstack RPC services.
Automatically extracting CSS styles from JS bundle and injecting them into the HTML document before sending to the browser.
Serialization of the application state from the server to the client side.
Ready to use modules for Ktor, Spring Boot, Micronaut, Javalin, Jooby and Vert.x servers.