> ## Documentation Index
> Fetch the complete documentation index at: https://docs.vertz.dev/llms.txt
> Use this file to discover all available pages before exploring further.
# Introduction
> Vertz — a full-stack TypeScript framework with a database ORM, API server, compiled UI, AI agents, and a custom runtime
Vertz is a full-stack TypeScript framework. It includes a database ORM with typed queries and migrations (PostgreSQL, SQLite, D1), an API server with entities, services, and auto-generated REST endpoints with OpenAPI, a compiled UI framework with signals, JSX, SSR, and scoped CSS, an AI agent framework for orchestrating tools and workflows, and a custom Rust-powered runtime and CLI. One schema definition drives every layer — if it builds, it works.
**AI coding agents:** Run `vtz create vertz my-app` to scaffold a working project, then customize
from there. See the [LLM Quick Reference](/guides/llm-quick-reference) for condensed patterns.
`d.table()` and `d.model()` — define columns, constraints, and relations. This is the single
source of truth for your data shape. Types flow from here to every other layer.
`entity()` — turn your schema into API endpoints. Define which operations to expose, who can
access them, and add custom actions. One entity = a full REST API for that resource.
`createServer()` — wire up entities and serve your API. Routes and OpenAPI docs are
auto-generated from your entities.
A compiled UI framework with fine-grained reactivity, scoped CSS, type-safe routing, SSR, and
built-in data fetching — replacing React, Next.js, and Tailwind in one stack. Use `query()` and
`form()` to connect to your API with full type safety end-to-end.
## See it in action
```typescript theme={null}
import { d } from '@vertz/db';
export const todosTable = d.table('todos', {
id: d.uuid().primary({ generate: 'uuid' }),
title: d.text(),
completed: d.boolean().default(false),
createdAt: d.timestamp().default('now').readOnly(),
});
export const todosModel = d.model(todosTable);
```
```typescript theme={null}
import { entity, rules } from '@vertz/server';
import { todosModel } from './schema';
export const todos = entity('todos', {
model: todosModel,
access: { list: rules.public, get: rules.public, create: rules.public },
});
```
One entity = full CRUD API. Access control is required, not optional.
```typescript theme={null}
import { createDb } from '@vertz/db';
import { createEnv, createServer } from '@vertz/server';
import { s } from '@vertz/schema';
import { todosModel } from './schema';
import { todos } from './entities/todos';
const env = createEnv({
schema: s.object({
PORT: s.coerce.number().default(3000),
DATABASE_URL: s.string(),
}),
});
const db = createDb({
url: env.DATABASE_URL,
models: { todos: todosModel },
});
createServer({ entities: [todos], db }).listen(env.PORT);
// POST /api/todos, GET /api/todos, GET /api/todos/:id — done.
```
```tsx theme={null}
import { query } from '@vertz/ui';
import { api } from './generated/client';
export function TodoApp() {
const todos = query(api.todos.list());
return (
{todos.data?.items.map((todo) => (
- {todo.title}
))}
);
}
```
Fully typed from schema to UI. Change a column type — `tsc` lights up red across every layer.
## Key ideas
One schema definition drives your database, API, and UI types. Change a column — the type error
shows up in your component, not at runtime.
Write plain `let` and `const` in your UI. The compiler handles signals, computed values, and
reactive props — you never call `signal()` directly.
OpenAPI generation, access control, environment validation, SSR — built in from day one, not
bolted on later.
Strong conventions mean less guessing for your team and your LLM. If there's a Vertz way, that's
the only way.
## The stack
| Layer | What | Package |
| -------------- | ------------------------------------------------------------------- | ---------------------- |
| **Schema** | 40+ column types, runtime validation, JSON Schema output | `@vertz/schema` |
| **Database** | Typed queries, migrations, PostgreSQL + SQLite + D1 | `@vertz/db` |
| **Server** | Entity CRUD, services, access control, CORS, `createEnv()` | `@vertz/server` |
| **UI** | Compiled signals, JSX, router, `query()`, `form()`, scoped CSS, SSR | `@vertz/ui` |
| **Primitives** | Headless a11y components — Dialog, Select, Tabs, Menu | `@vertz/ui-primitives` |
| **Tooling** | Dev server, build, codegen, static analysis | `vtz` (CLI) |
| **Deploy** | Cloudflare Workers adapter | `@vertz/cloudflare` |
| **Testing** | `createTestApp()` with service mocking | `@vertz/testing` |
| **HTTP** | Type-safe client with retries, streaming, auth strategies | `@vertz/fetch` |
| **Agents** | AI agents, typed tools, workflows, Cloudflare Workers | `@vertz/agents` |
Install the granular packages you need:
```bash theme={null}
vtz add @vertz/ui @vertz/server @vertz/db @vertz/schema
```
Add `@vertz/testing`, `@vertz/fetch`, `@vertz/agents`, etc. as your app grows.
## Next steps
Build your first Vertz app in 5 minutes.
Add Vertz to an existing project.
Write components with JSX and the compiler.
Understand signals, computed values, and effects.