Curricula

An open-source, privacy-focused resume builder web app featuring classic academic Harvard typography and precision PDF/print scaling.

DemoRepository

The Problem

Most modern resume builders either trap user data behind paywalls, produce bloated layouts that break applicant tracking systems (ATS), or require an active internet connection to edit and render simple documents. I wanted to build a web application that:

  • Keeps user resume data 100% private and offline-first using browser storage.
  • Uses a classic academic table-layout (Harvard template) that guarantees consistent, professional print and PDF formatting.
  • Provides seamless, real-time editing without relying on external servers or active network connectivity.

Architecture & Tech Stack

The project is built around an offline-first Progressive Web App (PWA) architecture with real-time preview scaling and modular resume form editors:

  • Framework: Next.js (App Router) for routing, API endpoints, and SSR/CSR layouts.
  • Styling & UI: Tailwind CSS + shadcn/ui for component styling, modals, forms, and responsive editor layouts.
  • State & Storage: Zustand and custom hooks for client-side state management, auto-saving (useCVAutoSave), and import/export (useCVImportExport).
  • PWA Engine: Custom service worker (sw.ts) for offline caching, standalone installation, and manifest handling.
  • Template Engine: Classic Harvard layout with clean typography optimized for ATS and print engines.

Key Challenges Solved

1. Accurate Print & Page Scaling

Different screen sizes and browser print engines often distort resume margins and page breaks.

  • Solution: Implemented dedicated zoom and scale hooks (usePageScale and ZoomControls) alongside print-ready utility wrappers (useCVPrint) to ensure the on-screen preview (ResumePreview.tsx) perfectly matches the exported PDF document.

2. Seamless Offline-First Experience

  • Solution: Configured a custom Progressive Web App service worker (app/sw.ts and public/manifest.json) paired with local auto-save hooks (useCVAutoSave.ts). Users can draft, edit, and export their resumes with zero network connectivity.

3. Modular Multi-Section Form Editor

  • Solution: Separated resume data editing into focused, reusable form components (PersonalForm, ExperienceForm, EducationForm, ProjectsForm, SkillsForm, and CertificationsForm) controlled by an ergonomic sidebar (EditorSidebar.tsx) with mobile view toggling (MobileViewToggle.tsx).

Live Features & Capabilities

  • ATS-Optimized Formatting: Structured Harvard layout template (HarvardTemplate.tsx) designed for clean document parsing.
  • Data Portability: Full JSON import and export functionality (useCVImportExport.ts) so users own their data.
  • Installable PWA: Support for desktop and mobile installation with custom app icons and manifest configuration.
  • Zero Network Dependency: Complete drafting, editing, and previewing works entirely offline via browser storage.

What's Next?

  • BYOK AI integration
  • Implement draggable section reordering within the EditorSidebar.
  • Add support for multiple resume version profiles stored locally in browser state.