# What Framework

> What is a signal-based reactive web framework built for AI agents. Components run once, no re-renders, no virtual DOM. The compiler lowers JSX to fine-grained DOM operations. A live MCP server (29 tools) lets agents inspect every signal, effect, and component in a running app, and its `what_fix` tool returns a diagnosis, fix, and worked example for any What error code offline.

Key facts an agent should know before writing code:

- State is a `signal(initialValue, 'debugName')`. Read with `count()`, write with `count(5)` or `count(c => c + 1)` (also `count.set(...)`).
- Components run **once**. The function body never re-executes, signals create fine-grained DOM effects instead of re-rendering.
- `computed()` is lazy, cached derived state. `effect()` auto-tracks signal reads (no dependency array). `batch()` flushes effects once and returns nothing.
- Import the core from `'what-framework'` (the umbrella package re-exports it). SSR and server actions live on `'what-framework/server'`, routing on `'what-framework/router'`; those names are not on the umbrella.
- Native What APIs are preferred. `what-react` is a secondary compatibility layer for the React ecosystem.
- **Compiled JSX cannot be server-rendered.** The compiler lowers JSX to a module-level `_$template()` that calls `document.createElement` at MODULE LOAD TIME, so importing a compiled module in Node throws `ReferenceError: document is not defined` before any render function runs. Write server-rendered components with `h()` or the automatic JSX runtime (`jsx`/`jsxs`, which build vnodes at call time), and keep the template compiler for client-only bundles. The full-stack `create-what` scaffold is buildless and uses `h()` for this reason. The static-site scaffold (`--template=islands`) writes JSX for the automatic runtime for the same reason: every page is rendered on the server.

## Start here

- [Getting Started](https://github.com/CelsianJs/what-framework/blob/main/GETTING-STARTED.md): Setup for agents and developers, including MCP wiring.
- [Quick Start tutorial](https://whatfw.com/docs/learn/): Build your first app and learn the core mental model.
- [Tic-Tac-Toe tutorial](https://whatfw.com/docs/tutorial/): A complete app built step by step.
- [Signals](https://whatfw.com/docs/learn/signals/): Fine-grained reactivity, the central concept.

## Reference

- [API reference](https://github.com/CelsianJs/what-framework/blob/main/docs/API.md): Full public API.
- [Architecture](https://github.com/CelsianJs/what-framework/blob/main/docs/ARCHITECTURE.md): How the compiler, runtime, and MCP bridge fit together.
- [TypeScript](https://github.com/CelsianJs/what-framework/blob/main/docs/TYPESCRIPT.md): Types and editor setup.
- [Styling](https://github.com/CelsianJs/what-framework/blob/main/docs/STYLING.md): CSS, Tailwind, and StyleX options.

## For AI agents

- [Starter library](https://whatfw.com/templates): Working apps with live demos, public source and per-app build guides, hosted on Vura.
- [Build from a starter](https://whatfw.com/templates/agents): A reproducible agent workflow; read each repository's README.md and BUILD.md before adapting it.
- [Starter index](https://whatfw.com/templates/llms.txt): Machine-readable links for verified starter releases.
- [Starter build status](https://whatfw.com/templates/status): Planned and in-progress products are labeled separately from verified releases; each has a status/reference journal.
- [Starter status index](https://whatfw.com/templates/status/llms.txt): Current phases, recorded checks, lessons and limitations for every starter.
- [Agent patterns](https://github.com/CelsianJs/what-framework/blob/main/docs/AGENT-PATTERNS.md): Ten copy-paste patterns for writing, debugging, and maintaining What code.
- [MCP DevTools](https://github.com/CelsianJs/what-framework/blob/main/docs/MCP-DEVTOOLS.md): The 29-tool MCP server for inspecting a running app in real time.
- [Gotchas](https://github.com/CelsianJs/what-framework/blob/main/docs/GOTCHAS.md): Common mistakes and how to avoid them.
- [Migration from React](https://github.com/CelsianJs/what-framework/blob/main/docs/MIGRATION-FROM-REACT.md): Mapping React idioms to What.

## Optional

- [Effect timing](https://github.com/CelsianJs/what-framework/blob/main/docs/EFFECT-TIMING.md): When effects run and how batching works.
- [Text engine](https://github.com/CelsianJs/what-framework/blob/main/docs/TEXT-ENGINE.md): The optional `what-text` engine.
- [Ecosystem roadmap](https://github.com/CelsianJs/what-framework/blob/main/docs/ECOSYSTEM-PLAN.md): Planned packages.
- [llms-full.txt](https://whatfw.com/llms-full.txt): Expanded version with inline quickstart, signals API, common errors, and MCP usage.