Datastar

The hypermedia framework

x: 
y:
speed:
Rocket

Build reactive web apps that stand the test of time

Datastar is a lightweight framework for building everything from simple sites to real-time collaborative web apps.

Bring Your Own Backend

Harness the simplicity of server-side rendering and the power of a frontend framework, with a single 11.79 KiB file.

Write your backend in the language of your choice (we have SDKs, too).

Get started

Datastar accepts text/html and text/event-stream content types, so you can send regular HTML responses or stream server-sent events (SSE) from the backend.

See the difference by trying zero and non-zero intervals below.

Hello world!

Network Response

Reactive frontends with no user-JS

Datastar allows you to iterate quickly on a slow-moving, high-performance framework.

Datastar: It’s Pretty Good — with David Nolen

Datastar solves more problems than it creates

Unlike most frontend frameworks, Datastar simplifies your frontend logic, shifting state management to the backend.

Drive your frontend from the backend using HTML attributes and a hypermedia-driven approach.

State in the right place

Add reactivity to your frontend using data-* attributes.

1<button data-on:click="@get('/endpoint')">
2    Open the pod bay doors, HAL.
3</button>
4
5<div id="hal">Waiting for an order...</div>

Backend driven frontends

Modify the DOM and state from your backend.

1sse.PatchElements(`
2    <div id="hal">I’m sorry, Dave. I’m afraid I can’t do that.</div>
3`)
4time.Sleep(1 * time.Second)
5sse.PatchElements(`<div id="hal">Waiting for an order...</div>`)
Waiting for an order...
Datastar is definitely the best tool that I’ve added to the web technology stuff that I do in at least 12 years.
Datastar is exactly like React, except without the network, virtual DOM, hooks, or JavaScript. Oh and you get multiplayer and realtime for free. Did I mention you can use any backend language you want? Datastar has solved the frontend for me – I can now get back to solving business problems.
Datastar gives me reactive, realtime applications without the complications of the JS/TS ecosystem. I had to change my way of thinking about building frontends, and I'm Oh-So-Glad I did!
Backed by a nonprofit
Supported by a community
Coded by hand
Sunset

Ready for liftoff?