Personal Portfolio

You're looking at it. This site was built in 12 hours, from first commit to production. Not a hackathon prototype. Not a landing page. A full bilingual portfolio with SSR, MDX content, and Lighthouse scores above 95. I built it in early 2025 as an experiment: what happens when you combine clear product thinking with AI-accelerated execution? Back then, this workflow was still new. Now it's how I build everything.

Why 12 Hours

I set the constraint deliberately. Portfolios are procrastination traps. I've seen engineers spend months tweaking theirs instead of doing the work they're trying to showcase. I wanted to prove a point to myself: with the right workflow, shipping fast doesn't mean shipping sloppy.

The constraint forced hard choices. No custom animations. No fancy interactions. Just clean typography, fast load times, and content that says what I actually do. Turns out that's enough.

How AI Fits In

I used Claude for about 80% of the code generation. But here's what that actually means: I made every architectural decision. I chose the component structure. I designed the routing. I decided what content goes where and how it reads. AI wrote the boilerplate that implements my decisions.

The workflow has clear boundaries. I don't ask AI to make product calls. I don't ship code I don't understand. When Claude generates something, I read it, think about whether I'd write it the same way, and often rewrite parts. The speed comes from eliminating the typing, not the thinking.

This matters because the AI-coding narrative is often wrong in both directions. Skeptics think it's useless. Enthusiasts think it replaces developers. Reality: it's a multiplier on existing skill. If you know what to build, AI helps you build it faster. If you don't, AI helps you build the wrong thing faster.

The Stack

Next.js with App Router. TypeScript in strict mode. Tailwind CSS. next-intl for i18n. MDX for content. Vercel for deployment. Nothing experimental, nothing clever. Proven tools that I know well enough to move fast.

The bilingual setup was more work than expected. Not the translation itself, but the routing, the metadata, the content switching. next-intl handles most of it, but there are always edge cases. English as the default without a prefix, Spanish with /es, shared components that need to work in both contexts.

MDX is worth the setup cost. Writing content in Markdown feels natural. Embedding React components when I need them keeps things flexible. The project pages you're reading are MDX files with exported metadata. Easy to write, easy to maintain.

Performance

Lighthouse 95+ across all categories. First Contentful Paint under 200ms at p99. Zero post-launch bugs.

This wasn't accidental. Next.js gets you most of the way with SSR and automatic image optimization. TypeScript strict mode catches bugs before they ship. Vercel's edge network handles caching. The remaining work was just not screwing it up: no unnecessary client-side JavaScript, no layout shifts, proper semantic HTML.

What I Learned

Constraints are tools, not limitations. The 12-hour deadline eliminated my tendency to invest too much time in small detail. I couldn't spend two days picking fonts. I couldn't rebuild the component library three times. I had to make decisions and move on.

AI collaboration requires taste. The hard part isn't getting AI to generate code. It's knowing what to ask for and knowing when the output is good enough. That requires having built things the slow way first. You need a mental model of what correct looks like.

Shipping beats perfecting. This site isn't perfect. There are things I'd change. But it exists, it works, and I can iterate. The alternative was another month of planning without a single line of code in production.

The workflow is repeatable. I've used this same approach on prototypes since then. Clear product thinking, AI-accelerated execution, tight constraints. It changes what one person can ship in a weekend.