Glossary

This glossary defines the key terms and concepts used throughout Nuxt Crouton documentation.

A

API Endpoint

Server-side route that handles HTTP requests for a collection. Nuxt Crouton generates RESTful endpoints for CRUD operations:

• GET /api/teams/[teamId]/[layer]-[collection] - List items
• POST /api/teams/[teamId]/[layer]-[collection] - Create item
• PATCH /api/teams/[teamId]/[layer]-[collection]/[id] - Update item
• DELETE /api/teams/[teamId]/[layer]-[collection]/[id] - Delete item

See also: Server API

Auto-Generated Fields

Fields automatically added to every collection by the generator:

• id - Always added (primary key)
• teamId, owner - Always added (team-scoped by default)
• createdAt, updatedAt, createdBy, updatedBy - Added when useMetadata: true (default)

Important: Never define these manually in your schema.

See also: Schema Format

C

Cache Invalidation

Process of clearing cached data when underlying data changes. Nuxt Crouton automatically invalidates caches after mutations using refreshNuxtData().

Example:

// Invalidate all queries for a collection
await refreshNuxtData((key) => key.startsWith('collection:products:'))

See also: Caching

Collection

The fundamental building block of Nuxt Crouton. A collection represents a data model (like products, users, or posts) and includes:

• Database schema (via Drizzle ORM)
• Generated CRUD components
• API endpoints
• TypeScript types
• Composables for data operations

Naming: Always use plural names (products, not product)

See also: Collections

Collection Schema

JSON file that defines the structure of a collection, including:

• Field names and types
• Validation rules
• Relationships to other collections (via refTarget)
• Metadata (label, required, etc.)

Location: schemas/[name].json

See also: Schema Format

Component Override

Replacing a generated component with your own custom implementation by creating a component with the same name in your layer.

Example:

layers/shop/collections/products/app/components/
└── _Form.vue  ← Generated form, yours to customize

See also: Customization

Composable

Vue Composition API function that encapsulates reusable logic. Nuxt Crouton provides composables for data operations:

• useCollectionQuery() - Fetch data
• useCollectionMutation() - Create/update/delete
• useCrouton() - Open forms in modals/slideovers/dialogs
• useNotify() - User notifications

Naming: Always start with use prefix

See also: Composables API

Core Layer

The base Nuxt Crouton framework code in node_modules/@fyit/crouton. This code is never modified directly.

See also: Architecture

CRUD

Create, Read, Update, Delete - The four basic operations for persistent storage. Nuxt Crouton auto-generates CRUD operations for every collection.

D

Domain-Driven Design (DDD)

Software design approach that organizes code by business domain rather than technical function. Nuxt Crouton uses layers to implement DDD.

Example:

layers/
├── shop/      # Shop domain (products, orders)
├── blog/      # Blog domain (posts, authors)
└── auth/      # Auth domain (users, sessions)

See also: Architecture

Drizzle ORM

TypeScript ORM (Object-Relational Mapping) used by Nuxt Crouton for database operations. Provides type-safe query builder.

External: Drizzle ORM Docs

See also: Drizzle Integration

F

Field

A property of a collection that represents a single piece of data (like title, price, createdAt).

Field Types:

• Text: string, text
• Number: number, decimal
• Boolean: boolean
• Date: date
• Structured: json, repeater, array
• Media: image, file

References use type: "string" with a refTarget property.

Naming: Use camelCase (firstName, isActive, publishedAt)

See also: Schema Format

Form Component

Auto-generated Vue component that renders a form for creating/editing collection items. Includes validation, error handling, and save/cancel actions.

Component: _Form.vue (generated per collection)

Customization: Edit the generated _Form.vue directly, as it lives in your project.

See also: Forms

G

Generated Code

Code automatically created by the Nuxt Crouton CLI based on your collection schemas. Includes components, composables, API routes, and database schema.

Location: layers/[collection-name]/

Regeneration: Safe to regenerate without losing customizations if you follow conventions

See also: Generated Code

Generated Layer

A Nuxt layer created by the Nuxt Crouton generator for a specific collection or domain. Contains all generated code for that collection.

Example:

layers/products/  ← Generated layer for products collection
├── components/
├── composables/
├── server/
└── types/

See also: Layers

I

Internationalization (i18n)

Multi-language support feature that allows translating collection fields into multiple languages.

Status: Stable ✅

See also: Internationalization

L

Layer

Nuxt's mechanism for extending applications with reusable code. Nuxt Crouton uses layers to organize collections by domain.

Types:

• Core Layer: Framework code (@fyit/crouton)
• Generated Layer: Auto-generated collection code (layers/products/)
• Feature Layer: Optional features (@fyit/crouton-i18n)

External: Nuxt Layers Guide

See also: Architecture

M

Migration

Database schema change managed by Drizzle ORM. Generated automatically when schemas change.

See also: Migration Guide

Mutation

Operation that modifies data (create, update, delete). In Nuxt Crouton, handled by useCollectionMutation() or useCroutonMutate().

See also: Mutation Composables API, Data Operations

N

Nuxt UI

Component library used by Nuxt Crouton for UI elements (forms, tables, modals, buttons, etc.).

Version: Nuxt Crouton uses Nuxt UI v4

External: Nuxt UI Docs

O

Override

See Component Override

P

Pagination

Splitting large datasets into smaller pages for performance and usability.

See also: Patterns - Tables

Q

Query

Operation that retrieves data without modifying it. In Nuxt Crouton, handled by useCollectionQuery().

See also: Querying Data

R

Reference Field

A field that creates a relationship between collections. Uses type: "string" with a refTarget property to specify the target collection.

Example:

{
  "authorId": { "type": "string", "refTarget": "users" }
}

See also: Relations

refTarget

Property of a reference field that specifies which collection it points to. Must be a plural collection name.

Example:

{ "categoryId": { "type": "string", "refTarget": "categories" } }

See also: Relations

Relation

Connection between two collections, implemented using reference fields.

Types:

• One-to-Many: One user has many posts
• Many-to-Many: Many posts have many tags

See also: Relations

S

Schema

See Collection Schema

Slot

Vue mechanism for customizing component content. Generated components like _Form.vue and List.vue live in your project and can be edited directly for customization.

See also: Customization

Stability Status

Label indicating production-readiness of a feature:

• Stable ✅ - Production-ready, API stable
• Beta 🔬 - Feature-complete, minor changes possible
• Experimental ⚠️ - Under development, API may change

See also: Features Overview

T

List Component

Auto-generated Vue component that displays collection items with sorting, filtering, and pagination.

Component: List.vue (generated per collection)

Customization: Edit the generated List.vue directly, as it lives in your project.

See also: Tables

Type Safety

TypeScript feature that catches errors at compile-time. Nuxt Crouton generates TypeScript types for all collections.

Example:

import type { Product } from '~/layers/shop/collections/products/types'
const { items } = await useCollectionQuery<Product>('products')
// items is typed as Product[]

See also: TypeScript Types

V

Validation

Checking data against rules before saving. Nuxt Crouton uses Zod for schema validation.

Example:

import { z } from 'zod'

const schema = z.object({
  title: z.string().min(1, 'Required'),
  price: z.number().min(0, 'Must be positive')
})

See also: Forms

Y

JSON Schema

JSON format used for collection schema definitions.

Example:

{
  "title": { "type": "string", "meta": { "required": true } },
  "description": { "type": "text" }
}

See also: Schema Format

Related Resources

• Conventions - Naming and coding standards
• FAQ - Common questions
• Troubleshooting - Problem-solving guide