Project Structure

One of Vuesion's core principles is keeping the project structure simple and predictable.

Instead of introducing dozens of top-level directories or deeply nested architectures, Vuesion groups files by responsibility. Once you understand the purpose of each area, navigating the project becomes straightforward.

Overview

The most important directories are:

src/
prisma/
tools/

Everything else is either generated, configuration, or project metadata.

src

The src directory contains the application itself.

It is divided into four major areas:

src/
├── app/
├── server/
├── shared/
└── public/

app

The app directory contains everything that runs in the browser.

This includes:

• Pages
• Layouts
• Components
• Composables
• Client-side services
• State management
• Assets

If you're building new user-facing features, this is where you'll spend most of your time.

server

The server directory contains everything that executes on the server.

Typical examples include:

• API endpoints
• Business logic
• Email templates
• Background tasks
• Middleware
• Server-side services

Keeping server code separate from client code makes responsibilities clear and prevents accidental coupling.

shared

The shared directory contains code that can safely be used by both the client and the server.

Typical examples are:

• TypeScript types
• Enums
• Constants
• Shared utilities
• Prisma-generated types

Anything inside shared should remain platform independent.

public

The public directory contains static assets that are served directly without processing.

Typical examples include:

• Images
• Icons
• Email assets
• Swagger documentation

prisma

The prisma directory contains everything related to the database.

prisma/
├── schema/
├── migrations/
└── seed.ts

Unlike many projects that store the entire database schema in a single file, Vuesion organizes Prisma models by domain.

This keeps the schema maintainable as the application grows.

tools

The tools directory contains development tooling that supports the project.

Examples include:

• OpenAPI generation
• Email generation
• Release automation
• Translation extraction
• Custom ESLint rules

These tools are not part of the application itself but help automate repetitive development tasks.

Keep it simple

As your product grows, resist the temptation to introduce additional top-level directories.

Whenever possible, extend one of the existing areas instead.

A predictable project structure helps every developer understand the codebase quickly and keeps long-term maintenance manageable.

Next steps

Continue with Architecture to learn how these different parts work together to form a complete application.