Built a full-stack AI-powered resume builder with real-time preview and advanced export system

Tech: Next.js, React, TypeScript, Supabase, Zustand, Puppeteer, Tailwind CSS, Framer Motion, OpenRouter AI

Description:

REREAL Resume Builder is a production-level web application that allows users to create, customize, and export professional resumes with real-time preview. It follows a “what you see is what you get” architecture, where the same React components power both the live preview and the final exported PDF, ensuring 100% visual accuracy.

The platform includes AI-powered suggestions for improving content, full resume analysis with scoring, and structured feedback for better job readiness. It supports multiple templates, dynamic customization, public sharing with QR codes, and both PDF and DOCX export.

Unlike traditional builders, it focuses on performance, precision, and user experience, using Puppeteer for real text-based PDF generation and a scalable JSON-based data model for flexibility.

Role: Full-Stack Development + System Architecture + UI/UX Design

Link: rereal-resumebuilder.vercel.app

Landing page for Rereal resume builder with the headline "Build your perfect resume in minutes.”

Template selection page showing previews of Blanc, Ivory, Recruit, and Hire resume styles.

Dashboard view of "My resumes" showing a grid of seven resume cards with templates and timestamps.

Modal interface for managing a resume's public link, copying URL, and sharing to LinkedIn.

App settings page for managing account profile details and toggling between light and dark themes.

Full resume editor view displaying the personal info sidebar and a complete preview of a resume for Vikas Nath.

Resume editor interface with personal info inputs and an AI analyzer panel showing a score of 68.

AI Resume Analyzer panel displaying specific content suggestions and a rewrite option for the summary section.

Full-screen preview of a resume for Vikas Nath showing professional experience and projects.