Add Fougere to an existing Nuxt app

Fougere adds its model layer to the existing app. Routing, pages, components, styling, and server routes remain in place. The module only registers its own paths: /_fougere/call (the envelope), /api/{frond}/… (REST surface) and /auth/** if you enable auth.

The three pieces

1. The module — in your existing nuxt.config.ts:

export default defineNuxtConfig({
  modules: [/* your modules */, '@fougere/nuxt'],
});

2. The configfougere.config.ts at the root (full reference):

import { defineFougere } from '@fougere/core';

export default defineFougere({
  db: { dialect: 'sqlite', path: '.data/app.db' },
});

3. A first Frond — one entity and one handler, at the root of the app you already have:

entities/Todo.ts
handlers/TodoHandler.ts

The scanner recognizes these two files through the convention used at the project root (the flat shape). A page writes import Todo from '@frond/<your-package-name>/entities/Todo' — the module registers that alias from the scan, so there is no package.json and no pnpm-workspace.yaml entry to add. A second domain later goes to fronds/billing/, and these two files stay where they are.

Run pnpm dev and check the log: scanned 1 frond(s).

Migrate feature by feature

Take one feature at a time; the old routes keep serving the rest. The following elements have a Fougere equivalent:

You maintain todayIt becomes
a Zod/Yup schemathe entity's fields — shape axis
a table definition or additive migrationderived — additive auto-DDL from the same fields; destructive changes stay explicit
server/api/todos.post.ts + validation calla handler operation, validated at the façade
form state + client-side rulesuseFormFor(Todo) — same validation as the server
useFetch('/api/todos') + refresh bookkeepinguseQuery(Todo, 'list') — revalidated by commands

Delete the originals as each feature lands — the point is fewer files to keep in sync, not a parallel copy.

What stays yours

  • Pages and components — the primitives are additive; no layout, no widgets.
  • Other server routes — anything outside the claimed paths is untouched.
  • Auth — optional. Keep your own system if you have one; useCurrentUser and the session-to-handler flow need Fougere auth to be enabled.

Current limits

  • The packages are on npm under the alpha tag — the version is the whole promise.
  • Storage is SQLite auto-DDL (Kysely underneath). An entity's table is owned by Fougere — bring a feature in when you can hand its storage over, keep your existing database access for the rest.

Next: The CLI — composing a workspace, hosting one Frond, calling an operation.

Another host?

This page is about Nuxt because its module does the mounting for you. The same Frond runs under Next, TanStack Start, React Router, SvelteKit and Express — three of them need no Fougere package at all. See Hosts.

Built with Fougere — this site runs on the framework it documents.