Reactive

Reactive – Is a reactive data model for two-way data binding directly in your HTML code without precompiling.

Main Features

• Reactive data model with automatic DOM updates.
• Two-way binding via data-model for inputs and form controls.
• Template expressions in HTML: {{property}}.
• Computed properties and watch for side effects.
• Built-in directives: conditional rendering (data-if) and loops (data-loop).
• Runtime templates and slots with no precompilation step.

Installation

You can install Reactive via npm:

npm install @olton/reactive

Usage

Basic Example

<div id="app">
  <h2>{{name}}</h2>
  <input type="text" data-model="name" />
</div>

<script type="module">
  import Reactive from '@olton/reactive';

  const app = new Reactive({
    name: 'John',
  });

  app.init('#app');
</script>

Documentation

Read about Reactive usage in the DESCRIPTION.

License

Reactive is licensed under a MIT license.

Sponsors

If you like this project, please consider supporting it by:

• Star this repository on GitHub
• Sponsor this project on GitHub Sponsors
• PayPal to [email protected].
• Patreon
• Buy me a coffee

Copyright © 2025-2026 by Serhii Pimenov