Resume Builder

A full-stack resume builder built with Next.js, featuring a rich text editor, live preview, PDF export, and version history.

Tech Stack

• Framework: Next.js 16 (App Router)
• Language: TypeScript
• Database: PostgreSQL + Drizzle ORM
• Auth: NextAuth v5 (credentials + GitHub OAuth)
• Editor: Tiptap (rich text)
• PDF: html2canvas-pro + jsPDF
• State: Zustand + Immer
• Styling: Tailwind CSS v4
• UI Components: Radix UI (via shadcn/ui)
• Testing: Vitest + Playwright

Features

• Credential and GitHub OAuth authentication
• Rich text editing with Tiptap (bold, italic, headings, lists, links)
• Live A4 preview pane with page navigation
• PDF download (multi-page A4 export)
• Autosave with debounce (2.5s)
• Version history (save/restore snapshots)
• Drag-and-drop section reordering
• 3 starter templates: Software Engineer, Product Manager, UX Designer
• 3 visual templates: Professional (one-column), Modern (two-column), Minimal (compact)
• Dark mode support

Getting Started

Prerequisites

• Node.js 20+
• PostgreSQL database

Setup

1. Clone the repo and install dependencies:

npm install

2. Copy the example env file and fill in your values:

cp .env.example .env

Required environment variables:

Variable	Description
DATABASE_URL	PostgreSQL connection string
AUTH_SECRET	NextAuth secret (openssl rand -base64 32)
AUTH_GITHUB_ID	GitHub OAuth client ID
AUTH_GITHUB_SECRET	GitHub OAuth client secret
NEXTAUTH_URL	App URL (default: http://localhost:3000)

3. Run database migrations:

npm run db:migrate

4. Start the dev server:

npm run dev

Open http://localhost:3000.

Scripts

Command	Description
npm run dev	Start development server
npm run build	Production build
npm run start	Start production server
npm run lint	Run ESLint
npm run test	Run unit tests (Vitest)
npm run test:e2e	Run E2E tests (Playwright)
npm run db:generate	Generate Drizzle migration files
npm run db:migrate	Apply database migrations
npm run db:push	Push schema directly (dev only)
npm run db:studio	Open Drizzle Studio

Project Structure

src/
  app/              # Next.js App Router pages & API routes
    (auth)/          # Login & register pages
    (dashboard)/     # Dashboard page
    api/             # REST API (resumes, versions, auth, health)
  components/
    dashboard/       # Dashboard UI
    editor/          # Editor shell, preview pane, section editor, version history
    templates/html/  # Resume HTML templates (OneColumn, TwoColumn, Compact)
    ui/              # shadcn/ui primitives
  data/              # Starter template data
  db/                # Drizzle schema & database client
  hooks/             # Custom hooks (autosave, PDF download)
  lib/               # Auth config, utilities
  store/             # Zustand store (resume state)
  types/             # TypeScript type definitions