# Hirola [![Latest Version](https://img.shields.io/crates/v/hirola.svg)](https://crates.io/crates/hirola) [![Browser Tests](https://github.com/geofmureithi/hirola/actions/workflows/browser.yml/badge.svg)](https://github.com/geofmureithi/hirola/actions/workflows/browser.yml) [![Unit Tests](https://github.com/geofmureithi/hirola/actions/workflows/unit.yml/badge.svg)](https://github.com/geofmureithi/hirola/actions/workflows/unit.yml) [![MIT licensed](https://img.shields.io/badge/license-MIT-blue.svg)](./LICENSE) **Hirola** is a declarative frontend framework that is focused on simplicity and reactivity. ## Goals 1. KISS: A simple and declarative way to build frontend UIs in rust. 2. Make it easy to read, extend and share code. 3. Frp signals allowing fine-grained reactivity. 4. Familiarity: Uses rsx which is very similar to jsx. ## Example We are going to create a simple counter program. ```bash cargo new counter ``` With a new project, we need to create an index file which is the entry point and required by trunk ```bash cd counter ``` Create an `index.html` in the root of counter. Add the contents below ```html Hirola Counter ``` Lets add some code to `src/main.rs` ```rust,no_run use hirola::prelude::*; use hirola::dom::*; fn counter() -> Dom { let count = Mutable::new(0i32); let decrement = count.callback(|s| *s.lock_mut() -= 1); let increment = count.callback(|s| *s.lock_mut() += 1); html! { <> {count} } } fn main() { hirola::dom::mount(counter()).unwrap(); } ``` Now lets run our project ```bash trunk serve ``` ## Ecosystem Check out [Hirola Docs](https://hirola-docs.vercel.app/basics/getting-started) written with Hirola itself! Here are some extensions for hirola: 1. [Form](https://hirola-docs.vercel.app/plugins/form) 2. [Router](https://hirola-docs.vercel.app/plugins/router) 3. [State](https://hirola-docs.vercel.app/plugins/state) 4. [Markdown](https://hirola-docs.vercel.app/plugins/mdx) ### Milestones | Status | Goal | Labels | | :----: | :--------------------------------- | --------- | | ✔ | Basic templating with rust and rsx | `ready` | | ✔ | Extend functionality with mixins | `ready` | | ✔ | Components | `ready` | | ✔ | SSR | `ready` | | ✔ | Signals | `ready` | | 🚧 | Form management | `started` | | ⏳ | Markdown templating | `pending` | | 🚧 | Styling | `started` | | ⏳ | SSG | `pending` |