Get started
Create a project with the published CLI, install dependencies, and start the development server:
npx @purityjs/cli my-app
cd my-app
npm install
npm run dev
The starter includes a counter component and a Vite configuration with the Purity compiler. Edit src/main.ts to see changes immediately.
The three building blocks
state() stores a value, compute() derives one, and html describes the DOM. Reactive expressions update when the state they read changes.
import { compute, html, mount, state } from '@purityjs/core';
const count = state(0);
const doubled = compute(() => count() * 2);
mount(
() => html`
<button @click=${() => count((value) => value + 1)}>Add one</button>
<p>Double: ${() => doubled()}</p>
`,
document.getElementById('app')!,
);
Build for production
For a client-only project, run npm run build and publish the generated dist directory to a static host.
For a server-rendered project, create it with --ssr, then run npm run build and npm start. The generated README explains which files to deploy to a Node host.
Go deeper
- Reactivity and templates explains state, derived values, bindings, and keyed lists.
- TypeScript explains inferred and explicit types.
- Shadow DOM explains component styling and boundaries.
- Accessibility covers focus and form patterns.
- Server rendering covers the generated SSR app and Node deployment.
- Architecture decisions record why features work the way they do.