Skip to main content
Prerequisites:
This guide walks you through setting up Reactive Resume for local development. Whether you’re contributing to the project or customizing it for your needs, these steps will get you up and running.

​
Setting Up Your Development Environment

1

Clone the Repository

git clone https://github.com/AmruthPillai/Reactive-Resume.git
cd Reactive-Resume
2

Install Dependencies

We use Bun as our package manager for its speed and efficiency.
# Install Bun if you haven't already
curl -fsSL https://bun.sh/install | bash

# Install project dependencies
bun install
3

Start Infrastructure Services

Start the required services (PostgreSQL, SeaweedFS, Gotenberg) using Docker Compose:
docker compose up -d
Wait for all services to be healthy before proceeding. Check with docker compose ps.
4

Configure Environment Variables

Create a .env file in the project root:
# Application
APP_URL=http://localhost:3000

# Database
DATABASE_URL=postgresql://postgres:postgres@localhost:5432/postgres

# Authentication
AUTH_SECRET=development-secret-change-in-production

# Storage (SeaweedFS)
S3_ACCESS_KEY_ID=seaweedfs
S3_SECRET_ACCESS_KEY=seaweedfs
S3_ENDPOINT=http://localhost:8333
S3_BUCKET=reactive-resume-start
5

Run Database Migrations

Apply the database schema:
bun run db:migrate
6

Start the Development Server

bun run dev
Your local Reactive Resume instance will be available at http://localhost:3000.

​
Available Scripts

Here are the most commonly used scripts during development:

​
Development

CommandDescription
bun run devStart the development server with hot reload
bun run buildBuild the application for production
bun run startStart the production server
bun run checkRun Biome linter and formatter
bun run typecheckRun TypeScript type checking

​
Database

CommandDescription
bun run db:generateGenerate migration files from schema changes
bun run db:migrateApply pending migrations
bun run db:pushPush schema changes directly (dev only)
bun run db:pullPull schema from existing database
bun run db:studioOpen Drizzle Studio (database GUI)

​
Internationalization

CommandDescription
bun run lingui:extractExtract translatable strings from code

​
Documentation

CommandDescription
bun run docsStart the Mintlify docs development server

​
Understanding the Project Structure

Understanding the project structure will help you navigate the codebase: 
reactive-resume/
├── src/
│   ├── components/         # Reusable React components
│   │   ├── ui/             # Base UI components (Button, Card, etc.)
│   │   ├── resume/         # Resume-specific components
│   │   └── ...
│   ├── dialogs/            # Modal dialogs
│   ├── hooks/              # Custom React hooks
│   ├── integrations/       # Third-party integrations
│   │   ├── auth/           # Better Auth integration
│   │   ├── drizzle/        # Database schema & utilities
│   │   └── orpc/           # API routes & services
│   ├── routes/             # File-based routing (TanStack Router)
│   │   ├── builder/        # Resume builder pages
│   │   ├── dashboard/      # User dashboard
│   │   ├── auth/           # Authentication pages
│   │   └── ...
│   ├── schema/             # Zod schemas for validation
│   ├── utils/              # Utility functions
│   └── styles/             # Global CSS styles
├── public/                 # Static assets
├── locales/                # Translation files (.po format)
├── migrations/             # Database migrations
├── docs/                   # Mintlify documentation
└── data/                   # Local data (fonts, uploads)

​
Working with the Database

​
Viewing the Database

Use Drizzle Studio to explore and manage your database: 
bun run db:studio
This opens a web-based GUI at https://local.drizzle.studio.

​
Making Schema Changes

  1. Edit the schema in src/integrations/drizzle/schema.ts
  2. Generate a migration: 
    bun run db:generate
  3. Apply the migration: 
    bun run db:migrate
Always review generated migrations before applying them, especially when working with existing data.

​
Working with Translations

Reactive Resume uses Lingui for internationalization.

​
Adding Translatable Text

Use the t macro for strings or <Trans> component for JSX: 
import { t } from "@lingui/core/macro";
import { Trans } from "@lingui/react/macro";

// For plain strings
const message = t`Hello, World!`;

// For JSX content
<Trans>Welcome to Reactive Resume</Trans>

​
Extracting Translations

After adding new translatable text, extract them to the locale files: 
bun run lingui:extract
Translation files are located in the locales/ directory in .po format.

​
Code Quality

​
Linting & Formatting

We use Biome for linting and formatting: 
# Check and auto-fix issues
bun run check

​
Type Checking

Run TypeScript type checking: 
bun run typecheck
Configure your IDE to use Biome for automatic formatting on save. For VS Code, install the Biome extension.

​
Troubleshooting

Another process is using port 3000. Either stop that process or start the dev server on a different port:
PORT=3001 bun run dev
Ensure Docker containers are running:
docker compose ps
docker compose up -d
Check that PostgreSQL is healthy and accessible on port 5432.
Verify SeaweedFS is running and the bucket exists:
docker compose logs seaweedfs
docker compose logs seaweedfs-create-bucket
If the bucket wasn’t created, restart the bucket creation service:
docker compose restart seaweedfs-create-bucket
If you encounter issues with Bun, try reinstalling:
curl -fsSL https://bun.sh/install | bash
Make sure your shell profile is reloaded:
source ~/.bashrc  # or ~/.zshrc
The route tree may need regeneration. Run the dev server which auto-generates routes:
bun run dev
Or run type checking to see specific errors:
bun run typecheck

​
Next Steps

Project Architecture

Deep dive into the project architecture and codebase structure.

GitHub Repository

View the source code and contribute to the project.