DEV Community

Cover image for How I built a Drag-and-Drop Resume Builder with React, Tailwind, and Supabase
Anant Agrawal
Anant Agrawal

Posted on

How I built a Drag-and-Drop Resume Builder with React, Tailwind, and Supabase

Hey devs! πŸ‘‹

I wanted to learn how to handle complex layouts and PDF generation in React, so I built a full Resume Builder.

The Tech Stack:

Frontend: React (Vite) + Tailwind CSS
Backend: Supabase (Auth + Database)
PDF Engine: html2canvas + jsPDF

The Hardest Part: Getting the PDF to look exactly like the HTML screen was a nightmare. I had to calculate specific pixel ratios to make sure the A4 size was perfect.

The Source Code: I decided to clean up the code and release it as a Starter Kit for anyone who wants to build their own SaaS or learn this stack.

You can check it out here: (https://aganant.gumroad.com/l/tqcwo)

Let me know if you have questions about the html2canvas config!

Update: I'm offering 50% OFF the source code for the first 5 people from Dev.to. Use code: "BUILDER50"

Top comments (0)