A tiny 3kb JavaScript Library for Prototyping Web Applications

A tiny 3kb JavaScript library for prototyping web applications.

  • Declarative: Lucia provides a declarative API similar to Vue to create views, making development predictable and intuitive through markup-centric code.
  • Reactive: When the view is changed and trapped by the observer, the internal Virtual DOM will automatically react and will update and render the new view in realtime.
  • Lightweight: Lucia is extremely light and performant as it renders directives only if necessary by skipping static nodes through element references.

β†’ Check out the Lucia Website

πŸ“© Installation

Lucia is currently is installable through a CDN and also supports UMD (ES Module, CommonJS, IIFE). Put this within your <head> tags in HTML.

<script src="https://unpkg.com/lucia"></script>

If you are using a module bunder like Webpack or Rollup:

npm install lucia

β†’ Learn more about installing Lucia

πŸ“• Documentation

The Lucia docs are located at https://lucia.js.org:

β†’ Learn how the Lucia Virtual DOM works

πŸ“Ί Example

Below is an example of a clicker game in Lucia. No, your eyes aren’t fooling you - it’s really that simple.

<div l-init="{ count: 0 }">
  <button l-text="this.count" l-on:click="++this.count">0</button>
</div>

β†’ View the live Codepen example

πŸ‘ Similar Projects

It should be noted that Lucia should not be implemented in all use cases. Lucia aims to tackle projects that need to be quickly implemented. This means if you’re looking for something production-ready and has a API similar to Lucia, check these projects out!

  • Vue - A progressive, incrementally-adoptable JavaScript framework for building UI on the web.
  • Alpine - A rugged, minimal framework for composing JavaScript behavior in your markup.
  • Remake - Create interactive web apps with just HTML.
  • Stimulus - A modest JavaScript framework for the HTML you already have.
  • Mavo - Create web applications entirely by writing HTML and CSS!

πŸ§‘β€πŸ€β€πŸ§‘ Contributing

Refer to the CONTRIBUTING.md file for instructions. Below are some of the projects under lucialand:

  • Luciascript - Hastscript like utility to create HTML strings
  • Luciex - Simplistic state management

Download Details:

Author: aidenybai

Demo: https://lucia.js.org/

Source Code: https://github.com/aidenybai/lucia

#javascript

A tiny 3kb JavaScript Library for Prototyping Web Applications
2.65 GEEK