Skip to content

LemonadeJS is a micro (4Kb) reactive, with a two-way data binding, no dependencies, JavaScript library that aims to be as close to JavaScript Vanilla as possible.

Notifications You must be signed in to change notification settings

celeg/lemonadejs

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

58 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Lemonadejs: Create amazing web-based interfaces

Lemonadejs is a super lightweight reactive 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 deliver reusable components and does not require transpilers, babel, or hundreds of other dependencies. It works 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

Example

Node

Build modern applications with lemonadeJS and node.

See this example on codesandbox

 
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 });
}

Browser

Simplicity to run in the browser without dependencies, servers, transpilers.

<html>
<script src="https://lemonadejs.net/v1/lemonade.js"></script>

<div id="root"></div>

<script>
function Hello() {
    let self = {};
    let template = `<h1>Hello World</h1>`;

    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>

Instalation

% npm install lemonadejs

License

This software is free to use and it is distributed under the MIT license.

Other tools

https://jsuites.net
https://jspreadsheet.com
https://bossanova.uk/jspreadsheet

About

LemonadeJS is a micro (4Kb) reactive, with a two-way data binding, no dependencies, JavaScript library that aims to be as close to JavaScript Vanilla as possible.

Resources

Stars

Watchers

Forks

Packages

No packages published