I built a Next.js 16 agency template — here's what actually mattered published: false tags: nextjs, react, webdev, tailwindcss

BadeHunt — Tue, 09 Jun 2026 11:36:00 +0000

I spent the last few weeks building an agency website template on Next.js 16, and the most useful lesson had nothing to do with code. Sharing it here in case it saves someone else the detour.
Live demo: https://bhagency-demo.pages.dev
The stack

Next.js 16 (App Router)
React 19
TypeScript
Tailwind CSS v4
Framer Motion for animation
next-themes for dark/light mode

Static export, deployable to any static host. No backend, no database — it's a frontend template meant to be customized and shipped fast.
What I got wrong first
My first version was technically fine and completely forgettable. Clean code, responsive, all the pages — and it looked like every other template. That was the real problem, and it took me too long to admit it.
The fix wasn't more features. It was design identity: one distinctive display font (Bricolage Grotesque), a single confident accent color instead of safe grays, and real spacing decisions. The code barely changed. The perceived value jumped.
Lesson: for a template, looking generic is the same as being useless. Buyers are paying to skip the design work, so the design has to feel intentional.
The decision I'd repeat
I moved all editable content — headlines, services, case studies, nav — into typed config files instead of burying it inside components. A buyer changes values in one place; they never touch JSX to update copy.
// app/config/site.ts
export const siteConfig = {
name: "Your Agency",
tagline: "We build brands that move",
// ...
}
It's a small structural choice that makes the whole thing feel like a product instead of a code dump. If you build templates, separate content from components early.
On SEO and routing
Dynamic routes for services, case studies, and blog posts use generateStaticParams + generateMetadata, so every page gets proper per-page metadata at build time. Sitemap and robots are wired in. For a marketing site, this is the part buyers forget to check and then regret.
What's next
It's live as a paid template if it's useful to you — link's on the demo site and my profile — but mostly I wanted to share the build lessons. Happy to answer anything about the static-export setup or the Tailwind v4 migration in the comments.
What's the one structural decision you wish you'd made earlier on a template or starter project?

DEV Community: BadeHunt

I built a Next.js 16 agency template — here's what actually mattered published: false tags: nextjs, react, webdev, tailwindcss