Quick Start Install Install Thunderous via NPM: npm install thunderous Usage Thunderous makes it easy to define smaller components with less noise. import { customElement, html, css, createSignal } from 'thunderous'; const MyElement = customElement(({ adoptStyleSheet }) => { const [count, setCount] = createSignal(0); const increment = () => setCount(count() + 1); adoptStyleSheet(myStyleSheet); return html` <button onclick="${increment}">Increment</button> <output>${count}</output> `; }); const myStyleSheet = css` :host { display: block; font-family: sans-serif; } `; MyElement.define('my-element'); What's Exported?

• customElement - A function for writing custom elements with a more declarative syntax. See Defining Custom Elements.
• html - A tagged template function for creating HTML templates. Signals can be bound to templates using this function. See Rendering.
• css - A tagged template function for constructing style sheet objects that can be adopted by shadow roots and documents. See Adopted Style Sheets.
• createRegistry - A function to create a registry for custom elements and use their associated classes to look up tag names dynamically. See Registries.
• createSignal - A function for creating signals that can be bound to templates. See Binding Signals.
• createEffect - A function for creating an effect that subscribes to the signals used within its body. See Effects.
• derived - A function for creating a derived signal that depends on other signals. See Derived Signals.

EXPERIMENTAL: The Thunderous Stack For full-stack applications with server-side rendering, static site generation, and client-side navigation, check out the Thunderous Stack. These experimental packages work together to provide a complete development experience:

• thunderous — Simplified functional web components.
• thunderous-csr — Client-side navigation for SPA-like UX in multi-page apps.
• thunderous-server — Static site generator that supports and enhances plain HTML.

The fastest way to get started is running npm init thunderous.