Back to Workshop resources
Claude Code1 min read

Scaffolding a Next.js site with Claude Code.

The opening prompts that work, the layout structure to ask for, and the libraries to refuse.

Haojun See
Haojun See

Founder & Director, On The Ground

Updated 6 June 2026

Overview

Next.js is the framework we teach because Claude Code knows it well and Vercel deploys it cleanly. The scaffolding prompts are reusable across projects once you've found the shape.

The structure prompt

"Scaffold a Next.js 16 + TypeScript + Tailwind 4 site with App Router. Pages: home, about, services, contact, blog. Use src/app structure. Server components by default; mark client only when needed. Tailwind utilities only — no UI library, no animation library."

What to refuse

• framer-motion (unless you've decided you need it). • Any UI library (shadcn is great but adds choice you don't need on day one). • Eslint plugins beyond the default. • Tests for a marketing site that's 5 pages.

First deploy moment

After ~90 minutes, push to GitHub and deploy on Vercel even if it's ugly. The deploy itself unblocks the rest of the day mentally.

Train your team on this

We teach teams to use Claude on their own work, and set up a company AI for them. Start with a free 1-hour preview, or see the full package.

Want to Apply This to Your Business?

We're a Singapore AI development and automation agency. Let's discuss how we can help solve your specific challenges.