Lemonadejs: Reactive library
Lemonadejs is a super lightweight vanilla javascript micro-library (4Kb). It aims to help the integration between the JavaScript (controllers) and the HTML (view). It supports two-way binding and integrates natively with Jsuites to help to create amazing interfaces quicker.
It would help you to deliver reusable components and does not require transpilers, babel, or hundreds of other dependencies and work just fine in any javascript dev environment. Lemonadejs has a quick learning curve and keeps coding fun and very close to native JS.
It would help you to deliver reusable components and does not require transpilers, babel, or hundreds of other dependencies and work just fine in any javascript dev environment. Lemonadejs has a quick learning curve and keeps coding fun and very close to native JS.
- Make rich and user-friendly web interfaces and applications
- Handle complicated data inputs with ease and convenience
- Improve the software user experience
- Create rich CRUDS and beautiful UI
- Highly flexible and customizable
- Lightweight and simple to use
Simplicity
Run lemonadejs in your browser without dependencies, servers, transpiling, only lemonadejs.
<html>
<script src="https://lemonadejs.net/v1/lemonade.js"></script>
<div id="root"></div>
<script>
function Hello() {
let self = {};
let template = `<div><h1>Hello World</h1></div>`;
return lemonade.element(template, self);
}
function App() {
let self = {};
self.count = 1;
let template = `<div>
<div><Hello /></div>
<p>You clicked {{self.count}} times</p>
<button onclick="self.count++;">Click me</button>
</div>`;
return lemonade.element(template, self, { Hello });
}
lemonade.render(App, document.getElementById('root'));
</script>
</html>
Modern applications
Build modern applications using lemonadejs and nodejs.
import lemonade from "lemonadejs";
import Hello from "./Hello";
export default function App() {
let self = {};
self.count = 1;
let template = `<div>
<div><Hello /></div>
<p>You clicked {{self.count}} times</p>
<button onclick="self.count++;">Click me</button>
</div>`;
return lemonade.element(template, self, { Hello });
}
See this example on codesandbox
Installation
% npm install lemonadejsOr download from our Github Official
History
Lemonade v1.0.0
- @bind, @ready, @ref magic properties.