cd /news/ai-tools/i-built-my-portfolio-with-claude-cod… · home › topics › ai-tools › article
[ARTICLE · art-136151] src=dev.to ↗ pub= topic=ai-tools verified=true sentiment=↑ positive

I built my portfolio with Claude Code. Here is what I decided myself

A developer rebuilt their personal portfolio using Claude Code, with the AI writing much of the code while the developer retained control over design, accessibility, SEO, and performance decisions. The production site, built on TypeScript, React 19, Next.js 16, Tailwind CSS 4, and Framer Motion and deployed on Vercel, scores 99/100/100/100 on desktop and 89/100/100/100 on mobile in Lighthouse. The developer emphasizes that AI tools assist rather than replace judgment, noting that a CSS-only hero optimization was reverted after Lighthouse showed no real gain.

by read2 min views9 publishedSep 21, 2026

I rebuilt my portfolio with Claude Code. The AI wrote a good part of the code. Every decision that mattered was mine.

I am sharing this for anyone who thinks AI tools do everything on their own. They do not. Someone still has to know what to build, what to measure and when to say no.

#

The stack

TypeScript, React 19, Next.js 16 (App Router), Tailwind CSS 4 and Framer Motion, deployed on Vercel with my own domain.

#

What I decided myself

A clean design. No extra widgets. A simple site reads as more professional than a busy one. #

An audit first, features second. I asked for a full review of SEO, accessibility and performance, then fixed things by priority. #

Real accessibility work. A control for auto-rotating carousels, hidden slides marked withinert , and touch targets sized for phones. #

SEO basics done properly. Per-page canonical and social metadata, a sitemap, a singleh1 in the hero, and the site verified in Google Search Console. #

Measure, then decide. I tried a CSS-only change to speed up the hero. Lighthouse showed no real gain, so I reverted it. The AI can suggest a change. Only measuring tells you if it worked.

#

The result (Lighthouse, production) | | Performance | Accessibility | Best practices | SEO | | Desktop | 99 | 100 | 100 | 100 | | Mobile | 89 | 100 | 100 | 100 |

#

What I would tell someone starting out

  1. Decide the goal and the constraints before you write a prompt.
  2. Ask for audits and reviews, not only for code.
  3. Read every change. You are the one who ships it.
  4. Measure before and after.
  5. Keep it simple.
Live site: [https://www.quevedojose.com](https://www.quevedojose.com)

More of my work: [https://github.com/Josequevedov08](https://github.com/Josequevedov08)

What is the first thing you check when you open someone else's portfolio?

source & further reading
dev.to — original article Jev & computer-use Google Gemini Notebook Adds Real-Time Mobile Voice Chat in Nearly 100 Languages Agentic Test Creation: From Plain-Language Requirements to End-to-End Test Cases
── more in #ai-tools 4 stories · sorted by recency
github.com · · #ai-tools
Pipper
── more on @claude code 3 stories trending now
sponsored brought to you by zahid.host 4,200+ EU-deployed projects
reading about agents? ship yours in a single git push.

Run your AI side-project on zahid.host

EU-based hosting, git-push deploys, automatic HTTPS, no cold starts. Free tier with a custom domain — perfect for shipping the agent you just read about.

$git push zahid main
→ Live at https://your-agent.zahid.host ✓
Get free account → Pricing
from €0/mo · no card required
LIVE [news/i-built-my-portfolio…] indexed:0 read:2min 2026-09-21 · —