Next.js and React development — one codebase for the site and the product

Most companies end up running two websites without ever deciding to. There is the marketing site, usually WordPress on a theme bought years ago, and there is the product, built in a different stack behind a different login. A pricing change ships twice. The design system drifts apart. The signup flow lives on the seam between them, and that seam is where customers fall out.

Next.js closes the seam. Marketing pages, product screens, authentication, API endpoints and scheduled jobs live in one TypeScript codebase and deploy as one thing. It is the stack we build our own products on: this site, the client portal, our admin and our AI chatbot are one Next.js application.

What Next.js development means in our hands

Server components by default, client components on purpose. Most React apps ship far more JavaScript than the page needs, then hide the cost behind a spinner. We render on the server and reach for client components only where real interactivity demands it, so pages arrive fast on a mid range phone over mobile data.

Core Web Vitals as a build gate. LCP, INP and CLS targets are agreed before the first component and measured on every pull request; a regression blocks the merge like a failing test. Lighthouse 95+ and WCAG 2.1 AA are the floor on every build, not a premium tier.

Caching designed, not inherited. Route by route we decide what is static, what revalidates on a schedule, what regenerates when content changes and what must stay dynamic. Done properly, a database backed site with a full admin serves from the edge as fast as a static one.

What a typical engagement includes

• An architecture pass: routing, rendering strategy and cache policy decided per route
• A typed component library and design tokens shared by marketing pages and product screens
• App Router build with server components, streaming and sensible suspense boundaries
• Postgres with Drizzle: typed queries and migrations in version control, no schema drift
• Authentication, roles and row level security where the product needs them
• Route handlers, webhooks and scheduled jobs in the same repository as the site
• Performance and accessibility budgets enforced in CI, plus screen reader testing
• Vercel deployment: preview URL per pull request, instant rollback, custom domain, SSL
• Existing URLs mapped to redirects, so search rankings survive the move
• Handover: documentation, admin access and a codebase you own outright

The stack and the approach

• Framework: Next.js 16 App Router with React 19, TypeScript end to end
• Styling: Tailwind v4 with design tokens, so a brand change is one file
• Data: Postgres with Drizzle ORM; Supabase for auth, storage and realtime where they earn it
• Rendering: static where possible, ISR where content changes, dynamic only where it must be
• Gates: type checks, lint, build, Lighthouse and accessibility checks on every pull request
• Hosting: Vercel, immutable deploys, rollback to any previous build in seconds

We also take over existing React codebases, moving them route by route rather than in one risky rewrite.

What this looks like in practice

Two shapes these engagements usually take.

A site and a product on one codebase. A company running WordPress at the front and a separate React app behind the login consolidates both into one deployment, one design system, one session. Editors publish without waiting on a release; engineers ship features without touching marketing pages. Same territory as our webapps work.

A rebuild for a site that got slow. An existing React or WordPress site that collected plugins and third party scripts until it failed its Core Web Vitals, rebuilt on the App Router with URLs and redirects preserved so the SEO foundation carries over intact.

Both usually pair with cloud and DevOps work, so shipping stays boring after launch.

Pricing

Next.js work is scoped to the project. A marketing rebuild and a multi tenant product on one codebase are different animals, and one rate card would mislead you on both. After a 30 minute call you get a written scope and a fixed price for it. Contact us for a quote, or browse our work and pricing first.

Ready to build?

We answer every brief within four business hours. Bring the codebase, the mess, or just the idea.

Start a Next.js project → — or book a 30 minute call