Technical Details

Learn about the technical details and architecture used in the Dopamine Starter Kit

Monorepo Management

Turborepo

Turborepo is a high-performance build system for JavaScript and TypeScript codebases. It manages the monorepo structure with intelligent caching, parallel execution, and dependency management across multiple packages and applications.

Frontend

Next.js

Next.js is a React framework that provides production-ready features like server-side rendering, static site generation, and API routes. The starter kit uses Next.js 15 with the new App Router for modern React development patterns.

React

React 19 is used as the core UI library, providing the component-based architecture for building interactive user interfaces with modern features like Server Components and concurrent rendering.

TailwindCSS

TailwindCSS is a utility-first CSS framework used for rapid UI development. Version 4.0 is configured with custom design tokens and component styling.

Shadcn/UI

Shadcn/UI provides a collection of beautiful, accessible, and customizable React components built on top of Radix UI primitives. It offers pre-built components like forms, dialogs, and navigation elements.

Auth.js

Auth.js (NextAuth.js) is a complete authentication library for Next.js applications. The starter kit includes configuration for multiple OAuth providers (GitHub, Google, LinkedIn, Microsoft) with session management and database persistence.

Backend

NestJS

NestJS is a progressive Node.js framework for building efficient, reliable and scalable server-side applications. As a mature framework with enterprise-grade features, it provides built-in dependency injection for clean, testable code architecture. NestJS seamlessly supports both REST APIs and GraphQL endpoints, delivering ultra-low latency responses for real-time applications. It also excels at managing long-running background processes, making it ideal for heavy workloads like video processing or AI agent operations.

Prisma

Prisma is a modern database toolkit that includes an ORM, database migrations, and a query builder. It provides type-safe database access with auto-generated TypeScript types and an intuitive schema definition language.

PostgreSQL

PostgreSQL is a powerful, open-source object-relational database system used for data persistence. It provides ACID compliance, advanced SQL features, and excellent performance for complex queries.

Payment Processing

Stripe

Stripe is integrated for handling subscription billing, payment processing, and customer management. The implementation includes webhook handling, subscription management, and per-seat billing capabilities.

Email Services

Resend

Resend is a modern email API service used for transactional emails like user invitations, notifications, and system alerts. It provides reliable delivery with detailed analytics.

React Email

React Email enables building email templates using React components. It compiles to HTML emails with excellent client compatibility and provides a development preview server.

Form Handling & Validation

React Hook Form

React Hook Form is a performant, flexible library for building forms with minimal re-renders. It provides excellent TypeScript support and integrates seamlessly with validation libraries.

Zod

Zod is a TypeScript-first schema validation library used throughout the application for runtime type checking, form validation, and API request/response validation. It provides excellent integration with TypeScript for compile-time and runtime type safety.

Development Tools

TypeScript

TypeScript provides static type checking for JavaScript, enhancing developer productivity with better tooling, early error detection, and improved code maintainability across the entire stack.

ESLint

ESLint is configured with shared configurations across all packages for consistent code quality and style enforcement. Custom rules are defined for Next.js, React, and NestJS specific patterns.

Prettier

Prettier handles code formatting automatically, ensuring consistent code style across the entire monorepo with shared configuration packages.

UI Enhancements

Framer Motion

Framer Motion is a production-ready motion library for React that provides smooth animations and transitions throughout the application interface.

Lucide React

Lucide React provides a comprehensive set of beautiful, customizable SVG icons with React components for consistent iconography across the application.

Next Themes

Next Themes enables seamless dark/light mode switching with system preference detection and persistent theme selection.

Development & Deployment

Docker

Docker containerization is configured for both development and production environments, with Docker Compose setup for running PostgreSQL databases locally.

Turborepo Caching

Advanced caching strategies are implemented to optimize build times and development workflows, with intelligent dependency tracking and remote caching capabilities.

Architecture Patterns

Monorepo Structure

The codebase follows a well-organized monorepo structure with:

  • apps/: Contains the main applications (web frontend, API backend)
  • packages/: Shared libraries (database, shared models, UI components)
  • tooling/: Development tools and configurations (ESLint, TypeScript, Prettier)

Workspace Management

Multi-tenant architecture with workspace isolation, member management, and per-workspace resource access controls.

Type-Safe Communication

Full-stack type safety with shared TypeScript types between frontend and backend, ensuring consistent data structures across API boundaries.