HTML Templates

Rejoice uses Maud for type-safe, compile-time HTML templating.

Basic Syntax

use rejoice::html;

html! {
    div {
        h1 { "Hello, World!" }
        p { "Welcome to my site." }
    }
}

Self-closing elements use a semicolon:

html! {
    img src="/logo.png" alt="Logo";
    input type="text" name="email";
}

Dynamic Content

Use parentheses for Rust expressions:

let name = "Alice";
let count = 42;

html! {
    p { "Hello, " (name) "!" }
    p { "Count: " (count) }
}

Conditionals and Loops

html! {
    @if is_admin {
        p { "Admin panel" }
    } @else {
        p { "User view" }
    }
    
    ul {
        @for item in &items {
            li { (item) }
        }
    }
}

Components

Create reusable components as functions:

fn card(title: &str, content: &str) -> Markup {
    html! {
        div class="card" {
            h2 { (title) }
            p { (content) }
        }
    }
}

html! {
    (card("Welcome", "Hello!"))
}

DOCTYPE

Include DOCTYPE in your root layout:

use rejoice::{html, DOCTYPE};

html! {
    (DOCTYPE)
    html {
        head { title { "My App" } }
        body { /* ... */ }
    }
}

For complete Maud documentation, see maud.lambda.xyz.