← Back to Dispatch

I'm Building 3 NextJS Sites in 10 Days With AI — Here's the Plan

nextjsai-assisted-developmentportfolioweb-developmentcareer

I'm Building 3 NextJS Sites in 10 Days With AI — Here's the Plan

It's Tuesday, March 25th, 2026. I'm sitting in our café in Davao at 5 AM with a cup of Mindanao arabica, and I'm about to attempt something I've never done before: build three production-quality NextJS websites, deploy all of them, and tie them together with a portfolio site — in 10 days.

I've been a web developer and digital strategist for 14+ years at Coffee For Peace, our family social enterprise. WordPress, WooCommerce, Shopify, brand design, operations — I've done it all. But the work I want to do next is different. I want to build modern NextJS/React applications for remote clients. And I need a portfolio that proves I can do it.

The problem? I don't have one. Not a single deployed NextJS project I can point an employer to.

So today I'm starting a sprint. And the tool that's going to make this possible is AI.

The Strategy

I'm not building random projects. Every mockup needs to prove a specific skill set that employers actually hire for:

  1. A service business landing page — the bread-and-butter work on job platforms. Marketing sites with interactive UI like booking calendars and contact forms.
  2. A headless Shopify storefront — e-commerce is where the money is. I want to show I can connect a NextJS frontend to a real Shopify backend via the Storefront API.
  3. A business dashboard — internal tools. Metric cards, data tables, charts. The kind of work that separates a $10/hour developer from a $20/hour developer.

Together, these three projects tell an employer: "This person can build my landing page, my store, AND my internal tools."

The AI Workflow

Here's how I'm using Claude — not as a code generator, but as a development partner:

  1. Plan with Claude — sitemap, component list, design direction, copy
  2. Build in Claude Code — scaffold components, generate boilerplate, debug
  3. Return to Claude for audits — screenshot the deployed site, get a fix list
  4. Fix and ship — apply fixes, push, redeploy

Claude handles the boilerplate so I can focus on architecture and design decisions. That's the pitch I want to make to employers too — AI-assisted development isn't about replacing skill, it's about multiplying output.

The Schedule

I'm blocking 6 focused hours each morning (6 AM – 12 PM PHT). Here's the plan:

  • Days 1–3: Salon landing page (Serenity Studio)
  • Days 4–6: Shopify storefront (That's G — Coffee Roastery)
  • Days 7–9: Business dashboard (BaseLine)
  • Day 10: Portfolio site (byronpantoja.com)

I'm targeting OnlineJobs.ph exclusively. One platform. One stack. One long-term client relationship. That's the income model.

What I'm Nervous About

Honestly? The Shopify API integration. I've built on Shopify before, but always through themes or the admin. This will be my first headless build — a NextJS frontend pulling data from the Storefront API via GraphQL. If I can get that working with real product data, live variant pricing, and cart state management, it'll be the strongest piece in the portfolio.

The dashboard is the other unknown. I've never built a data table with sorting, or used a charting library in React. But that's the point of the sprint — learn by shipping, not by taking another course.

Let's See What Happens

I'll be documenting the whole process. If this goes well, I'll have a complete portfolio by early April and can start applying for remote NextJS work. If it doesn't... well, at least I'll know where the gaps are.

The coffee's kicking in. Time to start building.


This is Part 1 of a 4-part series. Next: Day 2 — I Built the Entire Salon Site in One Session.

← All posts