Multi-Tenant & Localization Example

This example demonstrates how to use multi-tenancy combined with localization in a single Next.js app powered by Payload.

Testing the App

The app is setup to support 3 different custom domains: gold.localhost, silver.localhost or bronze.localhost.
Each domain will be parsed to identify the correct tenant and load the relevant localized content.

• Visit different tenant and locales combinations http://gold.localhost:3000/en/test then http://silver.localhost:3000/fr/test to see how different domains can be accessed with localized content rendered.

How It Works

• Next.js rewrites allows the tenant from the request's host header to be extracted and transformed internally to a /tenant/locale/path structure.
• The app directory matches this structure with nested folders:/app/[tenant]/[locale]/[...slug]
• The tenant and locale params are used in the page component to fetch and render the correct localized tenant content.

For a detailed breakdown of the code and setup, checkout the full README in the example root folder.