C og
C og
A simple, reactive UI library for HTML with zero dependencies.
Beginner-friendly
With zero dependencies and no extra tooling needed, Cog is a beginner-friendly library that keeps things simple. It uses plain HTML for templates, making it intuitive for those who are new to JavaScript or coming from a background of HTML and CSS.
Installation
Just add <script> tag to your index.html:
<script src="https://bit.ly/cogjs"></script>Or install via npm:
npm install @mzrk/cogHTML is HTML
In Cog, HTML remains as simple and intuitive as always, but with the added power of reactive variables. This means you can use familiar HTML syntax to build your web pages, while also being able to bind data to your HTML elements using Cog's reactive variables.
<!-- index.html --><div id="app"> <div>Counter: {{ "{{ counter }}" }}</div> <button onclick="increment()">Increment</button></div>Sweet Vanilla JS
Cog uses plain JavaScript to create reactive programming patterns and doesn't require any special syntax or language features. It provides a simple and intuitive way to create reactive data flows in your application.
// index.jsconst counter = Cog.variable("counter", 0);function increment() { counter.set(counter.value + 1);}Try it out!
Cog allows you to create dynamic, interactive web applications with ease. The HTML templates automatically update whenever the state changes, providing a seamless user experience.
