/articles/nextjs-localization-patternsBack to articles
Next.js7 min

A clean localization pattern for Next.js portfolio and product routes

Notes on organizing locale-aware routes, metadata, and content files in a way that scales from a portfolio to a larger product surface.

Published
2026-06-12
Read time
7 min

Localized routing gets messy when content, metadata, and navigation all evolve separately. A cleaner pattern is to keep locale-aware pages thin, load dictionaries close to the route, and centralize structured content where it can be reused safely.

Keep route files focused

I like route pages that do only a few things: validate the locale, load the dictionary or content, and hand the result to a presentational component. That keeps metadata generation and page rendering aligned.

Use structured content for repeatable sections

When content has repeated fields like title, summary, tags, and body sections, moving it into a typed data file reduces duplication and makes translation less fragile. It also gives us a single source for pages, cards, and sitemap generation.

Treat metadata as part of the feature

Localized pages should not stop at translated copy. Canonical URLs, alternate language links, and Open Graph content all deserve the same attention if the route is meant to be shared publicly.