Tonic — Web Component Framework

What is it?

Tonic is what we use to build our UIs. It's a framework for helping you write async web components. And it's a way to organize your thoughts as code.

class GithubUrls extends Tonic {
  async * render () {

    yeild this.html`Loading...`

    const res = await fetch('https://api.github.com')
    const data = await res.json()

    return this.html`
      <h1>Hello</h1>

      <pretty-printer
        type="json"
        value="${data}">
      </pritty-printer>
    `
  }
}

What are the goals?

No build tools. No hype based on false or outdated claims. No micro-benchmarks representing unrealistic use cases.

Tonic's goal is to help you organize presentation, logic, and event handling so you can compose components using a single file that contains a single class without any build tools or questionable complexity.

Is it production ready?

Yes. We've been using it for several years. Tonic is complete. The design is done. You're not going to find a blog post one day about how we changed something fundamental to the way it works.

No thought leaders? no core team?

There is no Patreon. No subscription model. No ads. There is no enterprise version. No multi-track conference. No cult. It's a tool for getting a job done.

Sounds good, how can I learn more?

Yeah. Here are the docs. Here is a repo full of example components. And here is the main library repo if you want to contribute or watch.