Skip to main content


What is Leafjs

Leafjs is a lightweight frontend framework built based on web components.

Using web components allows you to create components natively - supported by most modern browsers. Unlike React and Vue, Leafjs's component system is totally built on top of the web component system, meaning that you can even use your components through native tags inside a plain HTML file as long as importing your bundled code.

And for sure, Leafjs implements a simple reactivity system that allows two-way binding, just like most frameworks do.

Getting Started

Leafjs provides a out-of-the-box bundle tool for you to use. Run the following command in your shell to create a new Leafjs app:

yarn create leafjs-app my-app

Then run cd my-app to go into the app directory. Then install the dependencies using either Yarn or NPM. After that, run:

yarn dev

To start a hot reloading development server.

Or if you just wanted to play around with Leafjs online, here's a simple CodeSandbox for you: