Free-CV is a full-stack resume builder designed to provide a fast, flexible, and production-grade experience for creating professional resumes.
The platform enables users to build, customize, and export resumes with real-time feedback, while handling complex structured data, template rendering, and document generation at scale.
Resume builders are deceptively hard to build well. The data is deeply nested, the preview must stay perfectly in sync with edits, and PDF generation from web layouts is notoriously unreliable. Add payments and auth on top, and you've got a real full-stack challenge.
Free-CV follows a state-driven frontend with a service-oriented backend:
- Centralized state management using Redux Toolkit
- Real-time preview rendering based on state changes
- Template abstraction layer for reusable layouts
- Optimistic UI for smooth editing experience
- Modular architecture for:
- User management
- Resume persistence
- Payment workflows
- API-driven communication with the frontend
- MongoDB for storing structured resume data and user profiles
- Designed schema to support flexible sections (experience, education, etc.)
- Firebase Storage for assets (images, generated PDFs)
- Razorpay integration for handling payments and premium features
Decision: Use Redux Toolkit for managing resume state.
Why:
- Resume data is deeply nested and frequently updated
- Multiple components depend on shared state (editor + preview)
Outcome:
- Predictable state updates
- Easier debugging and extensibility
Decision: Derive preview directly from application state.
Why:
- Ensures consistency between user input and rendered output
- Avoids duplication of logic between editor and preview
Challenge:
- Frequent updates can cause performance issues
Mitigation:
- Component-level memoization
- Selective re-rendering strategies
Decision: Generate PDFs from rendered DOM using html2canvas + jsPDF.
Why:
- Guarantees visual parity with on-screen templates
- Avoids rebuilding layouts in a separate PDF engine
Decision: Design templates as reusable, configurable components.
Why:
- Enables adding new templates without changing core logic
- Supports different layout structures
Outcome:
- Scalable template system
- Faster iteration for new designs
Ensuring that every user input reflects instantly and accurately in the preview.
Solution:
- Single source of truth via Redux
- Derived UI rendering from state
Getting pixel-perfect PDFs is more art than science. Different browsers render shadows, fonts, and spacing slightly differently.
Solution:
- Tight control over layout and styling
- Standardized template constraints
Resume structures vary significantly across users.
Solution:
- Flexible schema design in MongoDB
- Normalized and predictable state structure in frontend
- Preview latency under 100ms for most edits
- Supports 10+ resume sections without UI lag
- Near pixel-perfect PDF parity across all major templates
This project was a strong exercise in building state-heavy, real-time applications:
- Designing scalable state management for complex UIs
- State management for real-time document editors is its own discipline
- Structuring applications for extensibility (templates, features)
- Building production-ready flows involving authentication and payments