Dynamic content

A component that just renders some plain markup isn't very interesting. Let's add some data.

Lustre applications are built from regular Gleam code. That means you can use any other Gleam function to work with your data.

Try changing "reverse" to "uppercase" 

import gleam/string
import lustre
import lustre/element.{text}
import lustre/element/html as h

pub fn view() {
  let name = "Hayleigh"
  let name = string.reverse(name)

  h.div([], [text("Hello, "), text(name), text("!")])
}

pub fn main() {
  let app = lustre.element(view())
  let assert Ok() = lustre.start(app, "div", Nil)
  Nil
}