Tonic

A Low Profile Component Framework – Stable, minimal, easy to audit, zero-de...

Web ComponentsUI Framework
socketsupply/tonictonicframework.dev@socketsupply/tonic

README

tonic

A low profile component framework.

- 1 file. 1 class. ~350 lines of code.
- No build tools required.
- Native web components.
- Ideal for JAM stacks.
- Identical on client & server.
- Composition oriented.
- Event delegation by default
- Lots of examples.

Getting Started


Building a component with Tonic starts by creating a function or a class. The class should have at least one method named render which returns a template literal of HTML.

  1. ``` js
  2. import Tonic from '@socketsupply/tonic'

  4. class MyGreeting extends Tonic {
  5.   render () {
  6.     return this.html`<div>Hello, World.</div>`
  7.   }
  8. }
  9. ```

or

  1. ``` js
  2. function MyGreeting () {
  3.   return this.html`
  4.     <div>Hello, World.</div>
  5.   `
  6. }
  7. ```



See: https://tonicframework.dev