Build interactive web applications, dashboards, and visualizations entirely in Julia.
Bonito.jl enables you to create rich, reactive web applications using Julia's Observables for state management and a simple HTML/DOM API. Observables can communicate with the Frontend via a performance optimized WebSocket connection, allowing you to build anything from data exploration dashboards to interactive documentation—all without being locked into a specific frontend framework.
- Reactive & Interactive: Built on Observables.jl for automatic UI updates when data changes, only sending the minimal amount of data possible via a fast binary serialization protocol
- Rich Component Library: Buttons, sliders, tables, code editors, and easy to build custom widgets
- Seamless Plotting: Deeply integrated with WGLMakie, plus support for Plotly, Gadfly, and more
- Deploy Anywhere: Works in VSCode, Jupyter, Pluto, web servers, or export to static HTML
- Javascript When You Need It: Easy ES6 module integration and Javascript execution
- Pure Julia Development: Write your entire application in Julia, with optional Javascript for client side rendering
- Extensible Handlers: Wrap and compose handlers for authentication, logging, static files, and custom middleware
- Use Any Existing JS/CSS/HTML: Bonito provides no opinionated styling by default. Combined with straightforward external dependency integration, this gives you complete access to the entire JS/CSS/HTML ecosystem from within Julia.
using Bonito
# Create a reactive counter app
app = App() do session
count = Observable(0)
button = Button("Click me!")
on(click-> (count[] += 1), button)
return DOM.div(button, DOM.h1("Count: ", count))
end
display(app) # display it in browser or plotpane
export_static("app.html", app) # generated self contained HTML file from App
export_static("folder", Routes("/" => app)) # Export static site (without Julia connection)
# Or serve it on a server
server = Server(app, "127.0.0.1", 8888)
# add it as different route
# regex, and even custom matchers are possible for routes, read more in the docs!
route!(server, "/my-route" => app)The Makie website is using Bonito's static site generator
Interactive WebGL-accelerated plotting library
animation.mp4
A customizable, Jupyter-like notebook environment
book-demo15179170215842797384.mp4
ai-demo9078760227891508270.mp4
NetworkDynamicsInspector.jl is an extension package to NetworkDynamics.jl which provides a WebApp based on Bonito.jl and WGLMakie.jl for interactive visualization of solutions to systems based on network dynamics.
network-inspector-2025-10-01_13.55.30.mp4
Have a look at some of the usage examples for Bonito, like the interactive markdown rendering support:
markdown-example-2025-10-01_14.07.10.mp4
Förderkennzeichen: 01IS10S27, 2020