synergy
    TypeScript icon, indicating that this package has built-in type declarations

    5.0.0 • Public • Published

    synergy

    npm Build Status Coverage Status gzip size

    Synergy is a JavaScript library for building Web Components

    Features

    • Simple templates for declarative data & event binding
    • Reactive data bindings update your view efficiently and automatically
    • Full component workflow using standard Web Components
    • Small footprint (~4k)
    • No special tooling required (e.g., compilers, plugins)
    • Minimal learning curve (almost entirely standard HTML, JS, and CSS!)

    Learn how to use Synergy in your own project.

    Browser Support

    Works in any modern browser that supports JavaScript Proxy.

    Installation

    Synergy is available from npm:

    $ npm i synergy

    You can also import Synergy directly in the browser via CDN:

    <script type="module">
      import { define } from "https://unpkg.com/synergy";
    </script>

    Documentation

    You can find the Synergy documentation on the website.

    Example

    Step 1. Define your custom element

    <script type="module">
      import { define } from "https://unpkg.com/synergy";
    
      define("hello-world", ({ name }) => ({ name }), "<p>Hello {{ name }}</p>");
    </script>

    Step 2. Use the custom element

    <hello-world name="kimberley"></hello-world>

    This example will render "Hello Kimberley" into a container on the page.

    You'll notice that everything here is valid HTML and JS, and you can copy and paste this example and run it directly in the browser with no need to compile or install anything special to make it work.

    License

    Synergy is MIT licensed.

    Install

    npm i synergy

    DownloadsWeekly Downloads

    18

    Version

    5.0.0

    License

    MIT

    Unpacked Size

    88.2 kB

    Total Files

    30

    Last publish

    Collaborators

    • avatar