{"id":13425938,"url":"https://github.com/defx/synergy","last_synced_at":"2025-04-05T22:04:05.082Z","repository":{"id":40633162,"uuid":"310058969","full_name":"defx/synergy","owner":"defx","description":"Synergy is a tiny runtime library for crafting Web Components","archived":false,"fork":false,"pushed_at":"2023-01-05T09:35:21.000Z","size":927,"stargazers_count":310,"open_issues_count":0,"forks_count":2,"subscribers_count":3,"default_branch":"master","last_synced_at":"2025-03-29T21:09:15.649Z","etag":null,"topics":["custom-elements","web-components"],"latest_commit_sha":null,"homepage":"https://synergyjs.org","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/defx.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2020-11-04T16:34:17.000Z","updated_at":"2024-09-25T11:44:37.000Z","dependencies_parsed_at":"2023-02-03T23:15:17.438Z","dependency_job_id":null,"html_url":"https://github.com/defx/synergy","commit_stats":null,"previous_names":[],"tags_count":43,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/defx%2Fsynergy","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/defx%2Fsynergy/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/defx%2Fsynergy/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/defx%2Fsynergy/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/defx","download_url":"https://codeload.github.com/defx/synergy/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247406085,"owners_count":20933803,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["custom-elements","web-components"],"created_at":"2024-07-31T00:01:22.473Z","updated_at":"2025-04-05T22:04:05.061Z","avatar_url":"https://github.com/defx.png","language":"JavaScript","funding_links":[],"categories":["JavaScript"],"sub_categories":[],"readme":"# [synergy](https://synergyjs.org)\n\n## [![npm](https://img.shields.io/npm/v/synergy.svg)](http://npm.im/synergy) [![Build Status](https://travis-ci.com/defx/synergy.svg?branch=master)](https://travis-ci.com/defx/synergy) [![Coverage Status](https://coveralls.io/repos/github/defx/synergy/badge.svg?branch=master)](https://coveralls.io/github/defx/synergy?branch=master) [![gzip size](https://img.badgesize.io/https://unpkg.com/synergy/dist/synergy.min.js?compression=gzip\u0026label=gzip)]()\n\nSynergy is a JavaScript library for building Web Components\n\n## Features\n\n- Simple templates for declarative data \u0026 event binding\n- Reactive data bindings update your view efficiently and\n  automatically\n- Full component workflow using standard Custom Elements\n- Small footprint (\u003c5k)\n- No special compiler, plugins, required\n- Minimal learning curve (almost entirely standard HTML, JS,\n  and CSS!)\n- Interoperable with other libraries and frameworks\n\n[Learn how to use Synergy in your own project](https://synergyjs.org/learn/introduction).\n\n## Browser Support\n\nWorks in any\n[modern browser](https://caniuse.com/mdn-javascript_builtins_proxy_proxy)\nthat supports JavaScript Proxy.\n\n## Installation\n\nSynergy is available from npm:\n\n```bash\n$ npm i synergy\n```\n\nYou can also import Synergy directly in the browser via CDN:\n\n```html\n\u003cscript type=\"module\"\u003e\n  import { define } from \"https://unpkg.com/synergy\"\n\u003c/script\u003e\n```\n\n## Documentation\n\nYou can find the Synergy documentation\n[on the website](https://synergyjs.org/).\n\n## Example\n\n### Step 1. Define your custom element\n\n```html\n\u003cscript type=\"module\"\u003e\n  import { define } from \"https://unpkg.com/synergy\"\n\n  define(\"hello-world\", () =\u003e ({ name }), \"\u003cp\u003eHello {{ name }}!\u003c/p\u003e\")\n\u003c/script\u003e\n```\n\n### Step 2. Use the Custom Element\n\n```html\n\u003chello-world name=\"kimberley\"\u003e\u003c/hello-world\u003e\n```\n\nThis example will render \"Hello Kimberley!\" into a container\non the page.\n\nYou'll notice that everything here is valid HTML and JS, and\nyou can copy and paste this example and run it directly in\nthe browser with no need to compile or install anything\nspecial to make it work.\n\n### License\n\nSynergy is [MIT licensed](./LICENSE).\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdefx%2Fsynergy","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fdefx%2Fsynergy","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdefx%2Fsynergy/lists"}