A modern, modular, and lightweight JavaScript library built for speed. All in less than 10kb.
Looking for documentation? Look here.
Accent is broken up into different standalone modules. Once combined, these modules work together as a single, full-fledged library.
You can install a module through NPM or a simple script tag in your HTML.
npm install @accent/[library-name]
<script src="https://unpkg.com/@accent/[library-name]"></script>
Here's an example page of a contact list using the Accent Renderer library:
<input type="text" ac-model="name" placeholder="Name" />
<input type="text" ac-model="email" placeholder="Email" />
<button ac-click="this.addContact(this, this.name, this.email)">Add</button>
<ul ac-for="let contact in this.contacts">
<li>
<strong>Name: </strong><ac>contact.name</ac><br />
<strong>Email: </strong><ac>contact.email</ac>
</li>
</ul>
<script type="module">
import "https://unpkg.com/@accent/renderer";
Accent.$context(document.body, {
contacts: [],
name: "",
email: "",
addContact(ctx, name, email) {
ctx.contacts.push({
name: name,
email: email,
});
},
});
</script>
Copyright © 2019-2020 Sri Pranav Kunda and contributors. Contributions are greatly appreciated.
Licensed under the MIT license. See LICENSE.md for details.
Accent's syntax and concepts are heavily inspired by Vue and Angular. Feel free to check them out, they may be a better fit for your use case.
Many of Accent's features utilize the functionality defined in these frameworks and split them into modules. This means that concepts such as client-side routing, data-binding, components, etc. can be used without dependency on other parts of the framework. This is described in more detail in the documentation.