Next.js
The framework that makes React production-ready.
What it is
Next.js is a framework built on top of React. React handles the UI layer; Next.js handles everything around it - routing between pages, server-side rendering, static page generation, API routes, image optimisation, font loading, and deployment configuration. It turns React from a UI library into a complete web framework.
It was created by Vercel and is now used by some of the largest sites on the web: Hulu, Twitch, TikTok, GitHub's marketing site. The reason is consistent: it handles the hard parts of web performance and SEO out of the box, so you can focus on building the product.
How I use it
Next.js is the framework I use for every web project. The App Router (introduced in v13) allows pages to be server-rendered by default, which means content arrives in the first HTML response rather than being injected by JavaScript after load. That matters a lot for SEO - search engines read the actual content, not a blank page that fills itself in.
Image optimisation is automatic: Next.js resizes, compresses, and serves images in modern formats (WebP, AVIF) without any manual configuration. Font loading uses `font-display: swap` and is self-hosted, avoiding the performance and privacy implications of loading Google Fonts from an external server.
Why this over the alternatives
Compared to a standalone React setup, Next.js provides server-side rendering, static generation, built-in image and font optimisation, and a mature deployment pipeline. Compared to WordPress, it's faster, more secure, and gives full control over the output. The PageSpeed scores speak for themselves.
What it means for your site
- Server-side rendering means search engines index your content properly
- Automatic image optimisation - serves the right size and format for every device
- Static generation for pages that don't change frequently, which means near-instant load times
- Built-in routing, API routes, and middleware without additional packages
Works with
Also in Frontend
Want this on your project?
Get in touch and we can talk through what stack makes sense for what you are building.
Start a conversation