Read the Introduction or Getting Started from the Kweb Book.
Modern websites consist of at least two tightly coupled components, one runs in the browser, the other on the server. These are often written in different programming languages and must communicate with each other over an HTTP(S) connection.
Kweb's goal is to eliminate this server/browser separation so you can focus on building your website or user interface, not on the plumbing.
Kweb is a remote interface to the web browser's DOM, driven by the server. With Kweb, you can create and manipulate DOM elements, and even bind values in your realtime database to DOM elements so they update automatically when the database changes.
Kweb is built on the Ktor framework, which handles HTTP, HTTPS, and WebSocket transport. You don't need to know Ktor to use Kweb, but if you already have a Ktor app, you can embed Kweb as a feature.
A common concern about server-driven interfaces is that they can feel sluggish. Kweb solves this problem by preloading instructions to the browser so that they are executed immediately on browser events, without the need for a round-trip to the server.
import kweb.*
import kweb.InputType.text
import kweb.state.KVar
fun main() {
Kweb(port = 16097) {
doc.body {
val name = KVar("")
div {
h1().text("Enter Your Name")
input(type = text).value = name
}
div {
span().text(name.map { "Hello, $it" })
}
}
}
}
This example illustrates creating DOM elements, modifying elements, KVars, and binding input elements.