Toolset · React, TypeScript, App Router
Next.js
- Next.js
- React
- TypeScript
Next.js with the App Router is our default for React web apps and full-stack sites. The stack favours server components, typed data access, and validation at the boundary.
Where two tools compete, the one marked our default is what we reach for.
Package manager
1 toolFast, disk-efficient package manager with a strict node_modules. Our default.
Data & server state
1 toolClient server-state caching and invalidation for interactive UIs — the standard for managing server state on the client for any interaction after the initial load. Decision rule: use Server Components for the initial page data and static rendering, and TanStack Query for subsequent client-side interactions, updates, and real-time data. Our default.
Client state
2 toolsMinimal, unopinionated client state. Our default.
Structured global state for larger apps.
ORM & database
2 toolsType-safe ORM with migrations and a great DX. Our default.
SQL-first, lightweight typed query builder — closer to the metal, with more control and performance for complex queries. Decision rule: start with Prisma for its productivity and safety; consider Drizzle only when you need fine-grained raw SQL control or Prisma's abstraction becomes a limitation.
Auth & validation
2 toolsSession/OAuth for Next; verify tokens, never trust decoded claims. Our default.
Schema validation for inputs, env, and API boundaries — parse, don't assume. Our default.
Environment variables
1 toolValidate env vars at startup with a Zod schema per variable, failing the build on anything missing or malformed. Declare public (NEXT_PUBLIC_*) and private variables separately so client bundles only ever see what's meant to be public. Never hardcode values. Our default.
Styling & UI
3 toolsUtility-first styling. Our default.
Copy-in, accessible component primitives built on Radix + Tailwind.
The built-in image component — automatic optimization, lazy loading, and modern formats (WebP, AVIF) with correct sizing to avoid layout shift. Our default for all images.
Testing
2 toolsFast unit/component tests. Our default.
Reliable end-to-end browser testing.
Monitoring & observability
4 toolsErrors, performance, and session replay across client and server, with source maps. Our default.
Vendor-neutral tracing with first-class Next support — export to any backend.
Core Web Vitals and traffic when hosting on Vercel.
Measure Core Web Vitals from any host and ship them to your own analytics.
Background jobs
2 toolsScheduled tasks via a cron endpoint (or a scheduled GitHub Action off Vercel). Keep job logic in a dedicated folder (e.g. jobs/) and invoke it from the cron route. Our default for scheduled work.
Redis-backed job queues for heavier, retryable background processing beyond simple schedules. On self-hosted deploys, run the worker from the standalone output under a process manager.
CI/CD
5 toolsThe native platform — preview deploys per PR, edge network, zero-config; ideal for most projects. Decision rule: start with Vercel for its productivity and scale; consider self-hosting only for specific infrastructure or compliance needs, or a scale where Vercel's pricing becomes inefficient. Our default.
CI for lint / typecheck / test before deploy.
Build caching and task orchestration for fast monorepo CI.
Full control over infrastructure, lower cost at scale, and a home for compliance constraints. Build with the standalone output (next build) and deploy to your own VPS behind a process manager.
Containerise the standalone output for reproducible self-hosted deploys.
Linting & formatting
4 toolsBuilding on Next.js?
We ship production Next.jswith exactly this stack. Tell us what you're building.
Start a conversation