Introduction

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 for condensed patterns.

Define your schema

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.

Create an entity

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.

Serve the API

createServer() — wire up entities and serve your API. Routes and OpenAPI docs are auto-generated from your entities.

Build the UI

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

Schema
API
Server
UI

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);

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.

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.

import { query } from '@vertz/ui';
import { api } from './generated/client';

export function TodoApp() {
  const todos = query(api.todos.list());

  return (
    <ul>
      {todos.data?.items.map((todo) => (
        <li key={todo.id}>{todo.title}</li>
      ))}
    </ul>
  );
}

Fully typed from schema to UI. Change a column type — tsc lights up red across every layer.

Key ideas

Types flow everywhere

One schema definition drives your database, API, and UI types. Change a column — the type error shows up in your component, not at runtime.

Compiler-driven reactivity

Write plain let and const in your UI. The compiler handles signals, computed values, and reactive props — you never call signal() directly.

Production-ready by default

OpenAPI generation, access control, environment validation, SSR — built in from day one, not bolted on later.

One way to do things

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:

vtz add @vertz/ui @vertz/server @vertz/db @vertz/schema

Add @vertz/testing, @vertz/fetch, @vertz/agents, etc. as your app grows.

Next steps

Quickstart

Build your first Vertz app in 5 minutes.

Installation

Add Vertz to an existing project.

UI Components

Write components with JSX and the compiler.

Reactivity

Understand signals, computed values, and effects.

Getting Started

@vertz/ui

@vertz/ui-compiler

@vertz/icons

@vertz/schema

@vertz/errors

@vertz/server

@vertz/agents

@vertz/db

@vertz/desktop

@vertz/fetch

@vertz/openapi

Deployment

Testing

Runtime

Introduction

See it in action

Key ideas

Types flow everywhere

Compiler-driven reactivity

Production-ready by default

One way to do things

The stack

Next steps

Quickstart

Installation

UI Components

Reactivity

​See it in action

​Key ideas

Types flow everywhere

Compiler-driven reactivity

Production-ready by default

One way to do things

​The stack

​Next steps

Quickstart

Installation

UI Components

Reactivity

See it in action

Key ideas

The stack

Next steps