# A simple example

The following example is copied-pasted from `examples/counter/lib.rs`, with some comments added.

```rust
// Unfornately, simi-macro require this feature to work, therefore, Simi only works with Rust-nightly.
#![feature(proc_macro_hygiene)]

use simi::prelude::*;
use wasm_bindgen::prelude::*;

// #[simi_app] is a `proc_macro_attribute`, it use `wasm-bindgen` internally to generate glue code for simi app to be created from JavaScript.
#[simi_app]
// Counter is the app state.
struct Counter {
    count: i32,
}

enum Msg {
    Up,
    Down,
}

// Implement the simi app trait for the app state.
impl Application for Counter {
    type Message = Msg;
    type Context = ();
    type Parent = ();
    fn init() -> Self {
        Self { count: 2018 }
    }
    fn update(&mut self, m: Self::Message, _: ContextPlus<Self>) -> UpdateView {
        match m {
            Msg::Up => self.count += 1,
            Msg::Down => self.count -= 1,
        }
        true
    }
    fn render(&self, context: RenderContext<Self>) {
        //           ^^^^^^^ `application!` access this argument. (The name must always be `context`).

        // This macro generates code for creating and updating the app's view
        application!{
            // If you want to see the generated code, uncomment the next line the build your code again.
            // @debug

            // Because the content of <h1> and <p> never changes, the are *almost* ignored when updating.
            h1 { "Counter" }
            p { "the " b {"simplest"} " version" }

            // <hr/>
            hr

            // The `#` before Msg::Down indicates that the message send by this button will never change.
            // Hence, the whole button has nothing to update. It is also *almost* ignored when updating.
            button (onclick=#Msg::Down) { "Down" }

            // The content of <span> has an expression `self.count` that may change, it will be checked
            // every time the `render` method is executed.
            span { " " self.count " " }

            button (onclick=#Msg::Up) { "Up" }
        }
    }
}
```