Run a Dioxus Liveview App

Getting an application running on is essentially working out how to package it as a deployable image. Once packaged, it can be deployed to the platform.

In this guide we’ll learn how to deploy a Dioxus Liveview application on

Dioxus Liveview allows apps to run on the server and render in the browser. It uses WebSockets to communicate between the server and the browser.

Bring Liveview app to life on is a breeze! With the help of the cargo chef, we get great build times and small images.


First, install flyctl, the CLI, and sign up to if you haven’t already.

The fastest way to get a basic Dioxus Liveview server on is to use our dioxus-liveview template:

git clone --single-branch --branch dioxus-liveview dioxus-liveview-app
cd dioxus-liveview-app
fly launch --generate-name

Deploy a Dioxus Liveview App from scratch

If you don’t already have an existing Axum application, you can create one with cargo:

cargo new dioxus-liveview-on-fly
cd dioxus-liveview-on-fly

Then we have to add some dependencies to the project:

cargo add dioxus axum
cargo add dioxus-liveview
cargo add tokio -F full

Now, let’s create a simple count incrementing app in src/

use axum::Router;
use dioxus::prelude::*;
use dioxus_liveview::LiveviewRouter;

fn app() -> Element {
    let mut num = use_signal(|| 0);

    rsx! {
        div {
            "hello axum! {num}"
            button { onclick: move |_| num += 1, "Increment" }

async fn main() {
    let addr: std::net::SocketAddr = ([0, 0, 0 ,0], 8080).into();

    let app = Router::new().with_app("/", app);

    println!("Listening on http://{addr}");

    let listener = tokio::net::TcpListener::bind(&addr).await.unwrap();
    axum::serve(listener, app.into_make_service())

This will display a counter that can be incremented using a button. The value will be updated over a websocket.

We can confirm everything works fine by running cargo run and checking out http://localhost:8080.

And with that you can deploy the app!

fly launch
Scanning source code
Detected a Dioxus Liveview app
Warning: This organization has no payment method, turning off high availability
Creating app in [redacted]/dioxus-liveview-on-fly
We're about to launch your app on Here's what you're getting:

Organization: Your Name              (fly launch defaults to the personal org)
Name:         [app-name]             (derived from your directory name)
Region:       Amsterdam, Netherlands (this is the fastest region for you)
App Machines: shared-cpu-1x, 1GB RAM (most apps need about 1GB of RAM)
Postgres:     <none>                 (not requested)
Redis:        <none>                 (not requested)
Sentry:       false                  (not requested)


==> Building image
==> Building image with Docker

Watch your deployment at[app-name]/monitoring

Visit your newly deployed app at https://[app-name]

This will generate a fly.toml file with the configuration for your app and a Dockerfile that uses cargo chef. Refer to the fly.toml docs for more configuration options.

To deploy a new version of your app, simply run fly deploy in the project directory.

You can check out the full (yet minimal) example in this GitHub repository for a reference.