_/    _/  _/_/_/      _/_/    _/_/_/_/  _/_/_/_/_/   
                         _/  _/    _/    _/  _/    _/  _/            _/        
                        _/_/      _/_/_/    _/_/_/_/  _/_/_/        _/         
                       _/  _/    _/    _/  _/    _/  _/            _/          
                      _/    _/  _/    _/  _/    _/  _/            _/           
                                                             

K.R.A.F.T. = Kotlin Rapid App Framework & Toolkit

Build single page apps with pure Kotlin.

Kraft bridges the gap between Kotlin code and the DOM by using Javascript VDom-engines like the very light-weight Preact.

It uses kotlinx/html for markup-rendering, so no template engine is needed.

It comes with a handy DSL for the FomanticUI Css Framework.

Check out the examples

Hello-World example

Try it out | See the code | Or run it locally

./gradlew -t --parallel :examples:hello-world:run

SemanticUi / FomanticUi examples

Writing beautiful web-apps without a css framework is very hard. Kraft comes with a handy DSL from the FomanticUI Css Framework.

Check out the examples, with lots of example code waiting to be copied and pasted.

Try it out | See the code | Or run it locally

./gradlew -t --parallel :examples:fomanticui:run

Addon examples

The addon examples show the usage of other Javascript libraries within a Kraft-App.

Try it out | See the code | Or run it locally

./gradlew -t --parallel :examples:addons:run

Example projects / repos

Hello World Demo
A minimal project.

Router Demo
A minimal example of how to write an app with multiple pages.

Remote Demo
An example project that shows how to consume rest apis and display the results.

Motivations for this project

Why Kraft ?

Why Kraft when there already is KotlinJS/React?

This project takes a different approach. It does not try to wrap around React. Instead, it uses very light weight VDom-engines like Preact.

This reduces the Javascript dependencies to a minimum. In fact, Preact has zero dependencies of its own! This makes the whole project much more stable in the long run.

Why FomanticUI ?

This project currently focuses on FomanticUI (previously SemanticUI) as a css framework. FomanticUI / SemanticUI uses a very "semantic" approach to writing styled markup. And as it turns out, this perfectly maps to a Kotlin DSL:

ui.segment {
    ui.button {
        +"Click me"
    }
}

Working with kotlinx/html happily removes the necessity for a template engine! Great!
Kraft::Fomantic adds another typesafe and IDE-assisted layer on top of that. Sweet!