Nuxt Auto

@websideproject/nuxt-auto-api

@websideproject/nuxt-auto-admin

Secure REST APIs and an admin panel for Nuxt, generated from your Drizzle schema — deny-by-default authorization, multi-tenancy, validation and typed TanStack Query composables.

📦 Modules

This monorepo contains two complementary Nuxt modules:

@websideproject/nuxt-auto-api

Secure REST APIs from your Drizzle schema: deny-by-default authorization, multi-tenancy, soft delete, M2M, bulk and aggregations, with TanStack Query composables.

@websideproject/nuxt-auto-admin

Auto-generated admin panel from Drizzle schema.

✨ Features

• 🎯 Schema-driven - CRUD, filtering, sorting, pagination, nested relations, bulk, aggregations and many-to-many from your Drizzle tables
• 🔐 Secure by default - every operation is denied until you declare who may do it; row visibility (tenant, listFilter, objectLevel) applies to every route; server-owned columns can't be written from a request
• 🏢 Multi-tenant - organization scoping resolved on the server and failing closed, ready for better-auth organizations
• 🧩 Bring your own auth - a better-auth plugin is included; any session works through a context extender
• ⚡ Typed, SSR-aware composables - TanStack Query with cache invalidation, optimistic updates and permission checks for the UI
• 🗄️ Any Drizzle engine - SQLite, Cloudflare D1, Turso, Postgres, MySQL and PlanetScale
• 📦 Admin panel - generated from the same resources with @websideproject/nuxt-auto-admin

🚀 Installation

Install the modules you need:

# Install API module
npx nuxt module add @websideproject/nuxt-auto-api

# Install Admin module
npx nuxt module add @websideproject/nuxt-auto-admin

# Or both
npx nuxt module add @websideproject/nuxt-auto-api @websideproject/nuxt-auto-admin

Or install manually:

# npm
npm install -D @websideproject/nuxt-auto-api @websideproject/nuxt-auto-admin

# yarn
yarn add -D @websideproject/nuxt-auto-api @websideproject/nuxt-auto-admin

# pnpm
pnpm add -D @websideproject/nuxt-auto-api @websideproject/nuxt-auto-admin

# bun
bun add -D @websideproject/nuxt-auto-api @websideproject/nuxt-auto-admin

📖 Documentation

📖 Full Documentation →

🤖 Claude Code Skills

If you use Claude Code, install the skill plugin to give Claude accurate knowledge of both nuxt-auto-api and nuxt-auto-admin APIs.

/plugin marketplace add websideproject/nuxt-auto
/plugin install nuxt-auto-skills

The plugin provides two skills:

• nuxt-auto-api — resource registration, CRUD composables, authorization, hooks, bulk ops, M2M, aggregation, plugins, multi-tenancy, and module authoring patterns
• nuxt-auto-admin — admin config, resource display, form field widgets, custom actions, permissions, composables, and module authoring patterns

🔍 PR Previews

Every pull request publishes a preview package via pkg.pr.new, so you can install and test changes before they are merged.

# npm
npm install https://pkg.pr.new/@websideproject/nuxt-auto-api@<pr-number>
npm install https://pkg.pr.new/@websideproject/nuxt-auto-admin@<pr-number>

# pnpm
pnpm add https://pkg.pr.new/@websideproject/nuxt-auto-api@<pr-number>
pnpm add https://pkg.pr.new/@websideproject/nuxt-auto-admin@<pr-number>

# bun
bun add https://pkg.pr.new/@websideproject/nuxt-auto-api@<pr-number>
bun add https://pkg.pr.new/@websideproject/nuxt-auto-admin@<pr-number>

🤝 Contributing

Contributions are welcome! Feel free to open an issue or submit a pull request.

# Install dependencies
bun install

# Generate type stubs
bun run dev:prepare

# Start the playground
bun run dev

# Run tests
bun run test

The engine conformance suite (packages/nuxt-auto-api/test/engines) runs the same requests on SQLite, libsql and D1 (Miniflare) every time, and on Postgres, MySQL and PlanetScale when you point it at them:

docker run -d -p 5432:5432 -e POSTGRES_PASSWORD=test -e POSTGRES_DB=autoapi postgres:17-alpine
docker run -d -p 3306:3306 -e MYSQL_ROOT_PASSWORD=test -e MYSQL_DATABASE=autoapi mysql:8.4 --max-connections=2000
docker run -d --network host ghcr.io/mattrobenolt/ps-http-sim:latest -listen-port=3900 -mysql-dbname=autoapi

AUTOAPI_TEST_PG_URL=postgres://postgres:test@localhost:5432/autoapi \
AUTOAPI_TEST_MYSQL_URL=mysql://root:test@localhost:3306/autoapi \
AUTOAPI_TEST_PLANETSCALE_URL=http://root:test@localhost:3900 \
bun run test

Screenshots

apps/playground/test/visual.spec.ts photographs the playground at 1440 px: the admin's pages, and its menus and dialogs opened the way a user opens them (search, filters, export, the row menu, view, delete and bulk delete, import, the list as a regular user), and the demo pages of the API (permissions per role, row and field, includes, aggregations, bulk operations, hooks, scoped tokens). CI compares every picture against the committed images. The images are the docs' own (apps/docs/public/screenshots/), so a page that changes fails CI until its pictures are refreshed. A shot's act steps are written as a user's clicks, so they also script a demo recording.

The pictures are taken in the Playwright Linux container CI uses (macOS renders fonts differently), so Docker must be running. From apps/playground:

bun run visual:baseline            # rebuild the demo database, build, serve and refresh every image
bun run visual:baseline admin      # only the images whose name matches, e.g. after changing the admin
bun run visual:baseline --check    # compare without writing, as CI does

Look at the changed images before committing them. On a CI failure, the visual-diff artifact holds the expected, actual and diff image of each failing page.

❓ Questions & Support

• Issues: Open an issue for bugs or feature requests
• Discussions: Join the discussion for questions and ideas

📄 License

Published under the MIT license.

Made by @bgervan and community 💛