diff options
author | Hayleigh Thompson <me@hayleigh.dev> | 2022-05-14 10:37:35 +0100 |
---|---|---|
committer | Hayleigh Thompson <me@hayleigh.dev> | 2022-05-14 10:37:35 +0100 |
commit | 22470f640a58f40c9a3404c62f478fb868f2e8c2 (patch) | |
tree | 06728d0222db498089d57c4a89b4b4aa0aa022af | |
parent | 1016a9005cd2d034e07380f3877d29fa9c26a8fe (diff) | |
download | lustre-22470f640a58f40c9a3404c62f478fb868f2e8c2.tar.gz lustre-22470f640a58f40c9a3404c62f478fb868f2e8c2.zip |
:memo: Update README to include a short example.
-rw-r--r-- | README.md | 34 |
1 files changed, 33 insertions, 1 deletions
@@ -1,10 +1,42 @@ # Lustre -> A playground for building create web apps – powered by Gleam! +> A framework for building create web apps – powered by Gleam and React! [](https://hex.pm/packages/lustre) [](https://hexdocs.pm/lustre/) +```gleam +import gleam/int +import lustre +import lustre/element.{ button, div, p, text } +import lustre/event.{ dispatch, on_click } + +pub fn main () { + let app = lustre.application(0, update, render) + lustre.start(app, "#app") +} + +type Action { + Incr + Decr +} + +fn update (state, action) { + case action { + Incr -> state + 1 + Decr -> state - 1 + } +} + +fn render (state) { + div([], [ + button([ on_click(dispatch(Decr)) ], [ text("-") ]), + p([], [ text(int.to_string(state)) ]), + button([ on_click(dispatch(Incr)) ], [ text("+") ]) + ]) +} +``` + > ❗️ This package relies on Gleam's JavaScript FFI and will not work if your are > targeting Erlang. |