Consecuit
An experimental functional web UI framework that uses the Rust type system for hooks and more.
How is this different from other frameworks?
Other Functional UI Frameworks:
-
Require the developer to follow the Rule of Hooks or something similar.
-
Dynamically identify components/hooks and maintain their states by counting the order in which they are called.
-
Dynamic design:
- Components are dynamically created and mounted as their parents render.
- Components may be mounted or unmounted depending on state.
Consecuit:
-
Automatically enforce the Rule of Hooks using the Rust type system.
-
Statically know every component that will be created and every hook call that will happen.
-
Static-first design:
- Components are statically mounted at the start of the app and remain mounted forever by default.
- Mounting/unmounting based on state are considered special cases available through explicitly using
opt_comp
,vec_comps
, etc.
What does it look like?
Take a look at our TodoMVC (and see its source code).
Or if you want something simpler, here is the code for a counter.
use *;
use *;
use *;
There are more counter examples here
(with live demo here),
including one without macro and one with logic extracted into a use_counter
function.
How do I start?
Follow our simple guide below:
Note: This guide is for you to get started as quickly as possible. The WASM setup part of the guide is very basic. You should read the rustwasm book later on.
-
Initialize a new lib crate.
cargo new --lib YOUR_CRATE_NAME_HERE cd YOUR_CRATE_NAME_HERE
-
Add this to your
Cargo.toml
:[lib] crate-type = ["cdylib"] [dependencies] wasm-bindgen = "0.2.74" consecuit = "0.2.0" consecuit_html = "0.2.0"
-
Create an
index.html
in the root of your project with this content.(replace
YOUR_CRATE_NAME_HERE
with the name of your crate.) -
Install
wasm-pack
:cargo install wasm-pack
-
Write your code.
You can copy-paste the counters example above.
Also take a look at the examples directory and the docs.
-
Build it!
wasm-pack build --dev --target web
-
Serve it!
# Install a simple web server. cargo install microserver # And run it! microserver
Final code is in examples/minimal_counter.
The docs have more info on creating components and hooks.
What's next?
This library is still in an early stage. A lot of features are missing. (For example, inline styling is not available right now; you need to use class names and write CSS.)
Contributions are welcomed!
This crate uses unsafe.
All publicly exposed functions are safe.