Introduction
A production-ready foundation for building modern applications with AI assistance.
StarterApp is a production-ready foundation for building modern applications. The architecture addresses authentication, billing, security, and real-time data persistence so development effort centers on product features.
AI-First Development
The codebase structure enables AI-assisted workflows through context engineering. Patterns in /llms/ templates, architectural documentation, and consistent conventions help AI agents generate production-grade code.
Architecture
Security
Security policies apply by default across the application. Rate limiting prevents abuse at the edge, CSRF guards protect state-changing operations, and middleware enforces Content Security Policy headers. The dual-app architecture separates marketing (static CSP with 'unsafe-inline') from dashboard (nonce-based CSP with 'strict-dynamic').
CSRF Protection
Middleware guards on all POST/PUT/PATCH/DELETE operations with origin and fetch metadata validation.
Rate Limiting
Edge-based throttling for HTTP endpoints plus Convex-native limits for business logic operations.
Type Safety
TypeScript coverage extends through server components, API routes, database schemas, and environment configuration. The @t3-oss/env-nextjs package validates environment variables at build time. Convex generates types from schema definitions, and Zod schemas enforce boundaries at runtime.
// Environment validation with runtime checks
import { loadServerEnv } from "@workspace/env/server";
const { APP_BASE_URL, GOOGLE_CLIENT_ID } = loadServerEnv();
// Type-safe Convex queries
const user = await fetchQuery(api.auth.getCurrentUser, {}, { token });
// user is typed as AuthenticatedUser | nullReal-Time Data
Convex ↗ manages data persistence and delivers live updates to connected clients. Queries subscribe to database changes and rerender components when relevant data mutates. The system maintains consistency without polling intervals or manual cache invalidation.
Define schema in convex/schema.ts
Write queries and mutations with builders (userQuery, userMutation, userAction)
Subscribe from components via useQuery(api.*.functionName)
Authentication
BetterAuth ↗ integrates with Convex for session management. The getToken(createAuth) pattern retrieves session tokens server-side without HTTP requests to authentication endpoints. OAuth providers (Google is configured by default) work through this unified interface.
The authentication bridge in @workspace/auth/server exposes a getSession() method for compatibility with UseAutumn billing, while actual authentication flows through Convex queries. The @workspace/app-shell package provides getCurrentSession() and requireUser() helpers for server components.
Authentication Guide
Configure OAuth providers, protect routes, and manage user sessions.
Protected Pages
Server-side session validation with cache-disabling exports.
Billing
UseAutumn ↗ connects to Stripe for payment processing. The convex/autumn.ts integration checks feature access (ctx.check()) and tracks usage (ctx.track()) directly in Convex actions. BetterAuth user IDs map to Autumn customer IDs without additional identity resolution.
Feature gates appear in autumn.config.ts as the single source of truth. Running npx atmn push synchronizes local configuration to the Autumn service.
Billing Integration
Configure Stripe, define products, and implement feature gating.
Feature Gating
Server-side access control with Autumn feature checks.
Heads up
Server-side gating is required. Client-side checks provide UX hints but cannot enforce access control.
AI Development Patterns
The /llms/ directory contains templates, architectural guides, and command specifications. AI agents read CODEBASE.md for navigation, AUTH_PATTERNS.md for authentication flows, BILLING.md for feature gating, and CONVEX.md for database operations.
Navigation
Installation Overview
Install dependencies, configure environment variables, and start the development server.
Tech Stack
Next.js 15, React 19, TypeScript, Convex, BetterAuth, UseAutumn, and Tailwind CSS.
AI Workflow
Develop features through AI-assisted patterns using context documents and templates.
Project Structure
Monorepo layout with apps, packages, convex backend, and documentation.
Getting Started
The application uses Next.js 15 with the App Router and React 19. Server Components render by default, while Client Components require 'use client' directives. The dual-app architecture separates apps/marketing (port 3000) from apps/dashboard (port 3001), enabling different CSP policies and caching strategies.