I18n Configuration

Overview

The initGT() function initializes General Translation (GT) settings for a Next.js application. By passing props to this function, we can control the internationalization (i18n) behavior of the app. This includes setting the default locale (a.k.a. the fallback language), supported locales, and other translation-related options.

Adding the plugin

The first step is to add the initGT() plugin function to your next config file.

Locating your next config file

In the root directory of your project, there should be a file called next.config.js (or .ts, .mjs, .cjs).

import { initGT } from 'gt-next/config'

my-app/
├── src/
│   ├── app/
│   │    └── page.js
│   └── components/
│       ├── Header.js
│       └── Footer.js
├── public/
│   └── favicon.ico
├── next.config.js <--- Add the plugin here 
├── .gitignore
├── package.json
└── README.md

Install the plugin

Set up a basic configuration for the plugin in your next.config.js file. This will fallback to the default values.

import { initGT } from 'gt-next/config';
 
const withGT = initGT({});
 
export default withGT({});

Some Examples

Basic Usage

In this configuration, we specify that the app is available in English, Spanish, and French. We also specify that the default language is English. We also add the description "A personal blog about technology and travel". This description will accounted in every translation that is performed.

import { initGT } from 'gt-next/config'
 
const withGT = initGT({
  defaultLocale: "en-US", // the default language of your app, usually "en" or "en-US"
  locales: ["en-US", "es", "fr"] // the languages your app is available in
  description: "A personal website for John Smith" // a natural language description of your site used to aid in translation
});
 
export default withGT({});

Include Locales

initGT() allows you to specify a list of locales you would like to include. For example, this configuration specifies that the app will be made available in English, Chinese, and Japanese.

This means that the app will only be available in these languages. Any locales not included in this list will not be translated. For instance, if a user tries to access the app in a language not listed, the app will default to the specified default locale.

import { initGT } from 'gt-next/config'
 
const withGT = initGT({
  defaultLocale: "en-US",
  locales: ["en-US", "zh", "jp"]
});
 
export default withGT({});

To see a list of supported locales, refer to the Supported Locales. For a more detailed guide on selecting locales, refer to the Locale Management Guide.

Configuring getLocale()

i18n is a string that specifies a custom path to a file that defines a getLocale() function. You can specify custom behavior for determining the user's locale by creating a file that exports a function called getLocale().

import { initGT } from 'gt-next/config'
 
const withGT = initGT({
  defaultLocale: "en-US", // the default language of your app, usually "en" or "en-US"
  i18n: "./i18n.js"
});
 
export default withGT({});

import { cookies } from "next/headers";
 
export async function getLocale() {
  const cookieStore = await cookies();
  return cookieStore.get('myCustomLocaleCookie') || 'en';
}

Preferred Provider

preferredModelProvider allows you to specify a preferred model provider. Currently, only Anthropic and OpenAI are enabled, but more providers will be added in the future.

We will route all your translations to your preferred LLM provider, but if your preferred model is not available or is not readily accessible, we will fallback on a different provider.

import { initGT } from 'gt-next/config'
 
const withGT = initGT({
  defaultLocale: "en-US",
  preferredModelProvider: "anthropic"
});

Notes

• initGT() allows you to configure the behavior of GT in your Next.js application.
• You can specify the default locale, supported locales, and other translation-related options.

Next Steps

• Read the API documentation for initGT().