dioxus/packages/fullstack
2024-02-19 08:35:31 -06:00
..
dist set the required environment variable for manganis support 2024-01-10 11:19:51 -06:00
examples Make clippy happy, pass tests 2024-02-18 21:08:48 -08:00
src Merge branch 'master' into pr/atty303/1948 2024-02-19 08:35:31 -06:00
.gitignore rename package to dioxus-fullstack 2023-05-02 10:15:34 -05:00
Cargo.toml Merge branch 'master' into pr/atty303/1948 2024-02-19 08:35:31 -06:00
README.md Upgrade to axum 0.7, drop 3rd party adapters 2024-02-15 18:05:30 -08:00

Dioxus Fullstack

Crates.io MIT licensed Build Status Discord chat

Website | Guides | API Docs | Chat

Fullstack utilities for the Dioxus framework.

Features

  • Intigrations with the Axum, Salvo, and Warp server frameworks with utilities for serving and rendering Dioxus applications.
  • Server functions allow you to call code on the server from the client as if it were a normal function.
  • Instant RSX Hot reloading with dioxus-hot-reload.
  • Passing root props from the server to the client.

Example

Full stack Dioxus in under 50 lines of code

#![allow(non_snake_case)]
use dioxus::prelude::*;
use dioxus_fullstack::prelude::*;

// On the web, run our client code
#[cfg(feature = "web")]
fn main() {
    dioxus_web::launch_with_props(
        app,
        get_root_props_from_document().unwrap_or_default(),
        dioxus_web::Config::new().hydrate(true),
    );
}

// On the server, run a simple warp server
#[cfg(feature = "server")]
#[tokio::main]
async fn main() {
    // Automatically handles server side rendering, hot reloading intigration, and hosting server functions
    warp::serve(serve_dioxus_application("", ServerConfig::new(app, ())))
        .run(([127, 0, 0, 1], 8080))
        .await;
}

fn app() -> Element {
    let meaning = use_signal(|| None);

    rsx! {
        h1 { "Meaning of life: {meaning:?}" }
        button {
            onclick: move |_| async move {
                if let Ok(data) = get_meaning("life the universe and everything".into()).await {
                    meaning.set(data);
                }
            },
            "Run a server function"
        }
    }
}

#[server]
async fn get_meaning(of: String) -> Result<Option<u32>, ServerFnError> {
    Ok(of.contains("life").then(|| 42))
}

Getting Started

To get started with full stack Dioxus, check out our getting started guide, or the full stack examples.

Contributing

  • Report issues on our issue tracker.
  • Join the discord and ask questions!

License

This project is licensed under the MIT license.

Unless you explicitly state otherwise, any contribution intentionally submitted for inclusion in Dioxus by you shall be licensed as MIT without any additional terms or conditions.