add readme.
This commit is contained in:
parent
0ca932c700
commit
1097974534
1 changed files with 32 additions and 0 deletions
32
README.md
Normal file
32
README.md
Normal file
|
@ -0,0 +1,32 @@
|
||||||
|
small utility for creating DOM trees from javascript arrays.
|
||||||
|
|
||||||
|
to use, clone/submodule/subtree/whatever the `main` branch, and import `json_as_html` from `export.mjs`.
|
||||||
|
|
||||||
|
to see a demo, or contribute, clone the `dev` branch.
|
||||||
|
|
||||||
|
here's the demo array being used at the time of writing this:
|
||||||
|
|
||||||
|
```javascript
|
||||||
|
[
|
||||||
|
"div",
|
||||||
|
[
|
||||||
|
["id", "wrapper"],
|
||||||
|
["class", "demo_div"],
|
||||||
|
],
|
||||||
|
[
|
||||||
|
["h1", [], "header :)"],
|
||||||
|
["p", [], "paragraph! meow"],
|
||||||
|
["p", [], "another paragraph!! this is so cool"],
|
||||||
|
state => ["button", [
|
||||||
|
["onclick", _ => {
|
||||||
|
state.set("clicked", true);
|
||||||
|
render();
|
||||||
|
}]
|
||||||
|
], "it can even do buttons!"],
|
||||||
|
state => ["p", [], state.get("clicked") ? "clicked" : "not clicked"],
|
||||||
|
],
|
||||||
|
]
|
||||||
|
|
||||||
|
```
|
||||||
|
|
||||||
|
it assumes a function `render` which replaces the contents of the `<body>` with the result of calling `json_as_html` with this array as argument. it also assumes a `Map` called `state`.
|
Loading…
Reference in a new issue