i18n for React Router

Introduction

Internationalization in React Router applications requires handling locale-aware routing, content loading, and formatting. React Router v7 provides nested routing, loaders, and actions that integrate naturally with i18n patterns. These guides show you how to build multilingual React Router applications using patterns that work with both client-side and server-side rendering.

The approach centers on URL-based locale segments, allowing each language version to have its own shareable URL. Loaders fetch locale-specific content, and components format data according to user preferences.

Next steps

Browse the sidebar to explore guides by topic. Each guide is self-contained with a problem statement, solution, and step-by-step implementation.

Start with locale-based routing to set up your URL structure. Then move to loading translations and formatting. The guides assume React Router v7 with file-based or config-based routing.