VibeResume

The landing page for VibeResume
How the VibeResume dashboard looks like
An example portfolio site created instantly from a resume with VibeResume

Inspiration

We wanted to make resumes more engaging and instantly useful. Instead of static PDFs, why not turn them into sleek, shareable personal sites—auto-generated in seconds? Also, any non-technical person trying to set up their own website will either find the process to cost a liver and a kidney (200 bucks a year) or just be plain complicated.

What it does

VibeResume lets users upload a resume, extracts the text, and uses AI to generate a single-page portfolio (HTML + Tailwind + inline JS). Each portfolio is hosted under a unique slug, which users can later customize. Users have CRUD capabilities over their generated sites, and can even ask the AI to make changes to their portfolio sites through a prompt.

How we built it

We used Next.js for the frontend with Typescript + TailwindCSS, Clerk for authentication, and Neon (Postgres) with raw SQL for the database. Resumes are uploaded and sent to the AI with schema context, and the returned HTML string is stored in the DB. Each portfolio is served via a dynamic route using the stored code.

Challenges we ran into

Getting Clerk authentication and middleware working seamlessly with protected routes.
Designing a clean abstraction over raw SQL queries.
Handling file uploads and text extraction reliably.

Accomplishments that we're proud of

Built a fully working resume-to-portfolio pipeline in a short timeframe.
Clean database schema and raw SQL abstraction.
Integrated AI in a way that feels seamless to the end user.
Dynamic hosting of generated sites with customizable slugs.

What we learned

How to combine authentication, database, and AI workflows smoothly in a Next.js app.
Importance of type safety and schema validation (via Zod).
How to structure prompts so AI generates usable front-end code.
Challenges of balancing speed of development vs. system reliability in hackathons.

What's next for VibeResume

Let users iterate on their sites by prompting the AI to make design/content tweaks.
Add support for editing portfolio content directly from the site they are on.
Improve HTML sanitization for security.
Allow inline JS recipes that work out of the box, like dark mode, animated gradients, mouse animations, parallax, etc.
Expand beyond resumes: turn LinkedIn profiles or raw text into instant portfolios.
Allow other configuration options before creating portfolio site, like uploading profile pic, choosing main color theme, etc.
Allow users to make resume links private, public, or share with certain people also on VibeResume.