ZenoZENO

What is Zeno

An opinionated framework of npm packages and shadcn registry items for building web applications with Next.js, React, TypeScript and Supabase.

Philosophy

Zeno follows these principles:

Development speed

Zeno speeds up development with presets you extend instead of writing, such as the TypeScript, Vitest and Playwright configs, and with one command per workflow, such as pnpm ci for the whole pre-PR pipeline.

Development experience

Development experience is part of development productivity. Time you spend configuring tools is time you don't spend building features, so Zeno ships the editor settings, extensions, linting, formatting and test setup already configured.

Opinionated

To get that speed and experience, Zeno takes strong stances on development best practices and architectural decisions. Instead of offering a long list of configuration options, it picks one tool per job and makes them work together: pnpm and Turborepo for the monorepo, Ultracite for linting and formatting, Supabase for the database and auth, and TanStack Form for forms. You make fewer setup decisions, and your projects stay consistent with each other. You can still override a preset where your project needs to, but the default is one clear path, which keeps applications easier to maintain.

High level

Because the stack is fixed, Zeno can ship higher-level building blocks, such as the form factory and the auth flows, so you build features instead of re-implementing the code underneath them.

AI conscious

Zeno is set up for AI coding assistants. AGENTS.md files hold the rules and traps for each folder, a Cursor hook formats every file an agent edits, and every docs page is also served as Markdown for an assistant to read.

Open code

Zeno follows the open code distribution model popularized by shadcn. UI that renders shadcn components ships through the shadcn registry, and the shadcn CLI copies its source into your codebase, where you and your AI assistant can read and change it. UI-free code ships on npm.

Modern

Zeno is built on current releases of these tools:

  • TypeScript 7: JavaScript with syntax for types.
  • Turborepo: Task runner and build cache for the monorepo.
  • Turbopack: The bundler Next.js uses by default.
  • React 19: The UI library Zeno's components are written in.
  • Next.js 16: The React framework Zeno apps run on, with the App Router.
  • Tailwind CSS 4: Utility-first CSS framework.
  • Ultracite: JavaScript/TypeScript linting and formatting.
  • Supabase: Postgres database and auth, run locally with the Supabase CLI.
  • Playwright: End-to-end browser testing.

Complete

Zeno aims to cover everything a web application needs. Some of the items below are still in progress or planned, and the roadmap shows the status of each. Here is a non-exhaustive list:

  • Monorepo: Turborepo and pnpm workspace with shared configurations and packages
  • Database: Supabase Postgres with Drizzle clients and row-level security
  • API: API routes with the Next.js App Router
  • Authentication: Supabase Auth flows for password and magic-link sign-in, sign-up and password recovery
  • Authorization: Role-based access control and permissions
  • Storage: File storage with CDN integration
  • Forms: A headless form factory on npm and a field kit in the shadcn registry
  • UI: shadcn components plus Zeno registry items such as the theme and the auth flows
  • Layouts: Pre-built layouts for common application patterns
  • Testing: Vitest and Playwright presets, plus helpers for testing Supabase row-level security
  • CI / CD: GitHub Actions workflows that run pnpm ci and publish the packages with Changesets
  • AI: AGENTS.md files, agent skills and a Cursor formatting hook
  • DX: Preconfigured editor settings, extensions and formatter
  • I18N: Internationalization and localization support