Architecture Guide
Understand how Craft projects are structured and how different architectural patterns adapt to your quality level.
Monorepo Structure
Craft uses Turborepo to manage a monorepo with multiple packages. This allows you to share code between different apps while maintaining clear boundaries.
project/
āāā apps/ # Applications
ā āāā web/ # Next.js web app
ā āāā mobile/ # React Native app (Web+Mobile only)
ā
āāā packages/ # Shared packages
ā āāā api/ # tRPC routers
ā āāā database/ # Prisma schema & client
ā āāā validators/ # Zod validation schemas
ā āāā ui/ # Shared UI components
ā
āāā tooling/ # Development tools
ā āāā typescript/ # Shared TypeScript config
ā
āāā .claude/ # AI Skills
āāā skills/ # Claude Code skillsTech Stack
Frontend
- ā¢Next.js 15 - React framework with App Router
- ā¢React 19 - UI library
- ā¢TypeScript 5.3+ - Type safety
- ā¢Tailwind CSS 3.4+ - Utility-first CSS
- ā¢shadcn/ui - Beautiful components
Backend
- ā¢tRPC 11+ - End-to-end type-safe APIs
- ā¢Prisma 6+ - Type-safe ORM
- ā¢Supabase - PostgreSQL + Auth + Storage
- ā¢Zod 3+ - Runtime validation
- ā¢TanStack Query 5+ - Data fetching & caching
Payments & Communication
- ā¢Stripe - Payment processing
- ā¢Resend + React Email - Transactional emails
Testing & Quality
- ā¢Vitest - Unit & integration tests
- ā¢React Testing Library - Component tests
- ā¢ESLint + Prettier - Code quality
Adaptive Architecture
One of Craft's unique features is its adaptive architecture. The structure of your code changes based on your chosen quality level:
š Rapid - Flat Architecture
Perfect for MVPs and rapid prototyping. Business logic lives directly in tRPC routers.
packages/api/routers/ āāā product.ts // All logic here (up to 100 lines)
āļø Balanced - 3-Layer Architecture
Pragmatic separation of concerns. Clean architecture without over-engineering.
packages/
āāā api/routers/
ā āāā product.ts // Thin orchestration (< 20 lines)
āāā services/
ā āāā product.service.ts // Business logic (< 50 lines)
āāā database/repositories/
āāā product.repo.ts // Data accessš Crafted - Hexagonal DDD
Enterprise-grade architecture built to last 10+ years. Full Domain-Driven Design.
packages/
āāā domain/ // Pure business logic (ZERO deps)
ā āāā entities/
ā āāā value-objects/
ā āāā use-cases/
ā āāā repositories/ // Interfaces only
āāā api/routers/ // Application layer (< 10 lines)
āāā infrastructure/ // Implementations
āāā database/
āāā external/Data Flow
Understanding how data flows through your Craft application:
Client (React)
ā
tRPC Router (Type-safe API)
ā
Service Layer (Business Logic)
ā
Repository (Data Access)
ā
Prisma ORM
ā
PostgreSQL (Supabase)All layers are fully type-safe thanks to TypeScript + tRPC + Prisma. You get autocomplete and type checking end-to-end.
Key Principles
Type Safety Everywhere
From database to UI, every piece of data is type-checked. Catch errors at compile time, not runtime.
Separation of Concerns
Each layer has a single responsibility. Easy to test, easy to maintain.
Scalable by Design
Start simple with Rapid, seamlessly upgrade to Balanced or Crafted as you grow.
Developer Experience
Fast HMR, type autocomplete, instant feedback. Built for productivity.
š” Architecture Migration
You can upgrade from one quality level to another using the Craft CLI. The migration tool will automatically refactor your code to match the new architecture pattern.