The Harness: How I Rebuilt My Portfolio for 87 Cents in One Afternoon

The Harness: How I Rebuilt My Portfolio for 87 Cents in One Afternoon

1. One Afternoon vs Three Days

3 days with claude vs 4 hours with claude + deepseek

In September 2025, I built my professional portfolio website and technical blog hfares.com in three days for $15. Replit agent, 60 chats, ChatGPT for requirements, Cloudflare Pages for hosting. Lighthouse said 97 performance, 92 SEO. I published a blog post about it and called it done.

Last week, I rebuilt it. One afternoon. 37 million tokens. 87 cents.

This is not a story about a better AI. It is a story about a better harness.

2. What "Done" Actually Looked Like

seo and ui/ux audit

I was proud of V1. The site was fast, bilingual, responsive. It did exactly what I wanted. I moved on.

Then two things happened. First, I ran into indexing issues. Some pages were not showing up on Google the way I expected. Second, new skills started appearing for Claude Code like Claude SEO and UI/UX pro max.

I decided to test them on my own site. What did I lose?

Th audit came out with red flags. The SEO audit gave me a 60 out of 100. The UI/UX audit found 12 issues.

A site that scored 97 on Lighthouse Performance and 92 on SEO had zero structured data. The numbers looked good. The site was not.

3. The Recipe

section 3: five steps pipeline plan

I did not start fixing things one by one. I built a pipeline.

Step one: migrate.

I had a replit.md file from the original Replit project. I asked Claude Code to initialize the project locally and create a CLAUDE.md from it. That took a few minutes. The project was out of Replit and into a local environment with full agent access.

Step two: audit in parallel.

I loaded both skills. The SEO audit skill from Daniel Agrici on GitHub. The UI/UX Pro Max skill from NextLevelBuilder. I ran them simultaneously. Each produced a full report with file paths, line numbers, and specific findings.

Step three: spec.

I told both skills to convert their findings into implementation spec files. Not vague recommendations. Exact instructions. Component names, CSS class replacements, code blocks. The specs you see attached to this post. Nothing left to interpretation.

Step four: execute.

I fed the spec files to Claude Code, but I did not use Claude's own models. I wired it to DeepSeek V4 Pro using the Anthropic API compatibility layer. If you want to do the same, the instructions are here. The agent worked through the spec files from critical to trivial. It did not skip. It did not improvise. It read the specs and executed.

Step five: grill.

I ran grill me. I had Claude Code critique the codebase. I asked it to identify unused components and dead dependencies, then draft an execution plan for the grooming.

4. The Numbers

One afternoon. 37 million tokens. 87 cents.

section 4: One afternoon. 37 million tokens. 87 cents.

The cost axis: 87 cents. For context, running the same token volume through Claude Sonnet would cost $50 to $80. DeepSeek V4 Pro is not just cheaper. It is two orders of magnitude cheaper. And capable enough to ship production work.

The time axis: one afternoon. Not three days. Not a weekend sprint. A single session from migration to grill.

The impact axis: the audits found issues I did not know existed. The agent fixed all of them. Including the ones that made me say "how did I miss that."

This combination is what makes it insane. Cheap enough to not think about. Fast enough to do in an afternoon. Thorough enough to catch things you did not know to look for.

5. What Actually Shipped

Not a highlight reel. Here is everything the agent shipped from the specs.

section 5. What Actually Shipped

SEO:

  • JSON-LD structured data on every page. Person, WebSite, Article, BreadcrumbList schemas.
  • Hreflang tags in the HTML head, not just the sitemap.
  • OG images with proper dimensions on every page.
  • HSTS header for forced HTTPS.
  • Caching rules for static assets, HTML pages, and sitemap.
  • llms.txt and llms-full.txt so AI crawlers can index the site properly.
  • Fixed sitemap slugs. sanwitch is now sandwich. sue is now use.
  • Trailing slash redirects now agree with canonical URLs.

Accessibility:

  • Dark mode. Real dark mode, not a stub ThemeProvider. CSS custom properties, class-based toggling, system preference detection, manual toggle in the navbar.
  • prefers-reduced-motion respected across all Framer Motion components. No forced animations for vestibular users.
  • Skip-to-content link as the first focusable element on every page.
  • Proper aria-label attributes on every icon-only button. Removed the <span className="sr-only"> hack.
  • Visible focus rings on every interactive custom component. Filter pills, blog cards, portfolio cards, magnetic buttons.
  • Mobile touch targets enlarged to 44px minimum.
  • Removed maximum-scale=1 from the viewport meta tag. Pinch-zoom works now.

UI/UX:

  • Unified color system. Three competing systems collapsed into one semantic token layer.
  • Resolved font conflicts. Three overlapping font stacks reduced to the intended one.
  • Simplified visual style. Removed Material elevation classes that conflicted with the Motion-Driven design.
  • Bilingual 404 page. English and Arabic, with navigation links.
  • Infinite bounce animation replaced with a one-time entrance. The scroll indicator still works. It just does not bounce forever.
  • Stats icons now scale on hover instead of rotating 360 degrees.

Performance:

  • 40% reduction in dependencies and JS bundle size.
  • Unused components identified and removed.
  • Dead code paths cleaned gracefully.

6. The Harness

Here is what I actually learned.

section 6. The Harness

DeepSeek V4 Pro is cheap and capable. Anyone can access it. Claude Code is a good interface. Anyone can install it. The audit skills are public. Anyone can load them.

The LLM is a commodity.

The value is in the harness. Knowing which skills to load. How to run them in parallel. How to convert audit output into executable specs. How to wire Claude Code to DeepSeek to cut costs by 50x. When to execute and when to grill.

The tools are free or nearly free. The orchestration is the skill.

Build your harness. The engine will keep getting cheaper.

7. The Catch

Making the right choices is still on you.

section 7. The Catch

Finding the right audit skills. Wiring Claude Code to DeepSeek without breaking the integration. Knowing when a spec is precise enough to hand off and when it needs more detail. Deciding which model to route each task to. The machine executes. You architect.

The tools are cheap. The judgment is not.

8. The Timing

This harness did not exist a few months ago.

section 8. The Timing

In September 2025, when I built V1, the agent landscape was different. Replit's agent was impressive for what it could do inside a browser. But you could not wire it to external models. You could not load custom skills. You could not grill your own codebase.

By May 2026, Claude Code had become a platform, not just a tool. DeepSeek had released an Anthropic API compatibility layer. Audit skills from the community had matured enough to produce production-ready specs. The pieces finally fit together.

V1 was impressive for its time. V2 is what happens when the tooling catches up to the ambition.

The gap between "looks done" and "is done" only became bridgeable recently. And cheaply. That is the part worth paying attention to.