MoonZoon is a Rust Fullstack Framework.

* Authentication methods are described in Backend.md

use zoon::*;

fn main() {
    start_app("app", root);
}

static COUNTER: Lazy<Mutable<i32>> = lazy::default();

fn root() -> impl Element {
    Row::new()
        .s(Align::center())
        .s(Gap::new().x(15))
        .item(counter_button("-", -1))
        .item_signal(COUNTER.signal())
        .item(counter_button("+", 1))
}

fn counter_button(label: &str, step: i32) -> impl Element {
    let (hovered, hovered_signal) = Mutable::new_and_signal(false);
    Button::new()
        .s(Width::exact(45))
        .s(RoundedCorners::all_max())
        .s(Background::new()
            .color_signal(hovered_signal.map_bool(|| color!("#edc8f5"), || color!("#E1A3EE", 0.8))))
        .s(Borders::all(
            Border::new()
                .width(2)
                .color(color!("oklch(0.6 0.182 350.53 / .7")),
        ))
        .on_hovered_change(move |is_hovered| hovered.set(is_hovered))
        .label(label)
        .on_press(move || *COUNTER.lock_mut() += step)
}

• Used by the command mzoon new (see the section Create & Run project below)

• @TODO Add once the apps are ready to show.

• Repo: examples/chat

• Related blog post: "Chat example, MoonZoon Cloud [dev.to / MD].

  

1. Install the latest stable Rust. (Or upgrade with rustup update stable.)

2. Install the web assembly target rustup target add wasm32-unknown-unknown

3. cargo install mzoon --git https://github.com/MoonZoon/MoonZoon --locked

4. mzoon new my_counter

5. cd my_counter

6. mzoon start --open

   

I use Coolify on Hetzner with this Dockerfile:

FROM rust:1
WORKDIR /app

RUN rustup target add wasm32-unknown-unknown
# NOTE: Set `--rev` to the commit you use in your project
RUN --mount=type=cache,target=/usr/local/cargo,from=rust,source=/usr/local/cargo \
    cargo install mzoon --git https://github.com/MoonZoon/MoonZoon --rev ccc15d043e78a6656d68a60d46de1f540724e093 --locked

COPY . .

RUN --mount=type=cache,target=/usr/local/cargo,from=rust,source=/usr/local/cargo \
    --mount=type=cache,target=target \
    /usr/local/cargo/bin/mzoon build -r

RUN --mount=type=cache,target=target \
    ["cp", "./target/release/backend", "/usr/local/bin/moon_app"]

ENTRYPOINT ["moon_app"]

MoonZoon app was successfully deployed to other services like Heroku (buildpack), Clever Cloud, CapRover or Fly.io.

MoonZoon Cloud is planned as well.

1. mzoon build --release --frontend-dist netlify

   • Hosting name (netlify) is optional. It creates files like netlify.toml.

2. [optional] Test it with a dev server like miniserve:

   cargo install miniserve
   
   miniserve --port 8079 --index index.html --spa frontend_dist

3. Drag & drop the frontend_dist directory to Netlify.

   

• Examples in the repo [See development.md for instructions how to run them.]

• Raytracer on MoonZoon [Not maintained)

• Voting system on the Solana blockchain. [Not maintained)

  

• Cure for Web Development [Medium / dev.to / MD]

• Rust on the Frontend and Backend [Always Bet on Rust]

• Interview with Martin about MoonZoon [console.substack.com]

1. CLI, Build pipeline, Live-reload, HTTPS [dev.to / MD]

2. Live demo, Zoon, Examples, Architectures [dev.to / MD]

3. Signals, React-like Hooks, Optimizations [dev.to / MD]

4. Actix, Async CLI, Error handling, Wasm-pack installer [dev.to / MD]

5. Chat example, MoonZoon Cloud [dev.to / MD]

• MartinKavik/js-framework-benchmark

1. "Why another framework? Are you mad??"

   • I want to write products. Reliable products. Quickly. I want to enjoy the development. I don't want to play endlessly with tools, protocols and config files.

2. "Is it production-ready? / What's the current progress?"

   • The frontend part is almost ready. If you have a custom backend or don't need backend at all then you can start writing your new frontend app right now! And then deploy it wherever you want. I assume there'll be two bigger breaking changes - to improve color system (related issue) and to improve event handlers - but the Rust compiler should make the future migration simple.

   • Realtime communication between frontend and backend works but neither virtual actors nor native database adapters have been implemented yet. However, Actix API has been exposed to overcome these current limitations so you can treat the MoonZoon backend API as Actix with realtime messaging. I've successfully integrated Postgres (through SeaORM) into a MoonZoon app developed for my client and I plan to integrate BonsaiDb to my another production app. Bonsai could be integrated as a scalable database and file storage into MoonZoon when I'll find it a suitable choice.

   • Subscribe to #news channel on our Discord server to find out when MoonZoon is ready for your project. Or just let us know what blocks you from starting to develop with MZ.

3. "Who is developing it?"

   • Martin Kavík (a former Seed maintainer, Rust freelance developer) with the help of the awesome community.
   • An interview with Martin Kavík

4. "Could I help somehow? / Where can I find more information?"

   • Join our Discord chat and don't hesitate to ask any questions or present your ideas.
   • Create a pull-request if you want to fix typos, dead links, weird Czech-English sentences, etc.
   • If you think MoonZoon will be useful for your project, I want to know that! (Use chat or martin@moonzoon.rs).
   • Don't hesitate to tell your friends about MoonZoon and feel free to share the link (http://moonzoon.rs) on social platforms / forums / blogs / newsletters.

5. "Why Rust?"

   • It's the best language.

     Longer explanation

     I've written commercial or hobby projects in multiple languages (Js, CoffeeScript, TS, Elm, Elixir, PHP, C, C++, C#, Go, ..). However I want to write only in Rust.

     Rust is hard to learn even for experienced developers because they have to unlearn many things and adapt thought process to Rust concepts and best practices. However, once you stop fighting the compiler, Rust takes your hand and push you to correct and efficient solutions.

     I had similar feeling when I was learning to drive a car - it seems to be pretty difficult/strange from the start but once you get used to it, you know that each control / button / pedal has it's specific place and purpose for a good reason. And it makes even more sense when you learn low-level stuff - e.g. how the transmission and a clutch work.

     Steep learning curve also brings some benefits:

     • It means that Rust doesn't hide real complexity behind too simple models.
     • It's almost impossible for complete beginners to publish incomplete/buggy libraries.

     _

     Rust is designed so well that I feel nervous while I'm writing in other languages - I have to do compiler's work again in my head and think about weird things like typos in code, nulls, undefineds, memory leaks, accidental mutations, how to write fast code without mutability, etc. It generates significant cognitive load so I can't focus so much on business logic and other important stuff.

     I don't believe you should use the most suitable language for a specific domain or problem at all costs. I think consistency among your / company projects, productivity and simplicity should have the highest priority. And Rust is a very universal language so I think it's a good choice for almost all cases.

     There are also things that should be improved (and are improving):

     1. Compilation is still slow, but it's not so frustrating now.
     2. IDE support still isn't very good because of Rust complex types and macros but thanks to Rust Analyzer it's getting better every day.
     3. target folder (it's something like node_modules) can be pretty big.
     4. It's a bit difficult to combine sync and async world in some cases and choose the best async runtime and error handling libraries. Also async drop would be nice.
     5. #[derive(xx)] and cargo install may have a bit surprising behavior.
     6. It may be a bit difficult to pick compatible dependencies.

     So there is still room for improvements but even now I'm the most productive in Rust.

Thank you for reading! We are waiting for you on Discord.