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. You can create and manipulate DOM elements, and listen for and handle DOM events.
Kweb has a state system that lets you easily bind values in your realtime database to DOM elements. This way, the elements are automatically updated when the database changes.
A common concern about this approach is that the user interface might feel sluggish if it is server-driven. Kweb solves this problem by preloading instructions to the browser. This way, the instructions are executed immediately on browser events without a server round-trip.
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've already got a Ktor app you can embed Kweb as a feature.
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.
