uland

🦄 µland

^{Social Media Photo by Ben Klea on Unsplash}

micro land, or unicorn land, is a µhtml take at neverland.

Same API, except the exports are {Component, render, html, svg}, where Component is a function you can use either as new Component(...) or just Component(...) which is the equivalent of neverland default export.

Announcement

Are you looking for something even more similar to React? Then don't miss 🐪 kaboobie out!

API

The concept is exactly the same as the neverland one.

Live demo.

import {Component, render, html, useState} from 'uland';

const Counter = Component((initialState) => {
  const [count, setCount] = useState(initialState);
  return html`
  <button onclick=${() => setCount(count + 1)}>
    Count: ${count}
  </button>`;
});

// basic example, show two independent counters
render(document.body, html`
  <div>
    A bounce of counters.<hr>
    ${Counter(0)} ${Counter(1)}
  </div>
`);

Please check neverland to know more about this module usage.