# General Translation React SDKs (gt-react, gt-next): Next.js
URL: https://generaltranslation.com/en-US/docs/react/nextjs.mdx
---

title: Next.js
description: Explore the Next.js-specific features of General Translation, including server components, server functions, the config plugin, middleware, request locale registration, and localized navigation.

---

`gt-next` shares the same components, hooks, and configuration as the rest of the General Translation React ecosystem, but Next.js adds a few capabilities that no other framework has. These pages cover the parts that only apply to `gt-next`.

If you are just getting started, follow the [Next.js App Router Quickstart](/docs/react/nextjs-quickstart) or [Next.js Pages Router Quickstart](/docs/react/nextjs-pages-router-quickstart). The shared [Guides](/docs/react/guides/configuring) and [Reference](/docs/react/reference/config) cover everything that works the same across frameworks; the pages here cover the Next.js-only surface.

## What is Next.js-specific [#overview]

Most of `gt-next` is the shared React API. The Next.js-only pieces are:

- **Server components.** In the App Router, the [`<T>`](/docs/react/reference/components/t) component and translation hooks work in synchronous React Server Components without a `'use client'` directive. Async components use functions from `gt-next/server`. See [Server components](/docs/react/nextjs/server-components).
- **Server functions.** The App Router-only `gt-next/server` entry exposes async functions such as [`getGT`](/docs/react/nextjs/reference/functions/get-gt), [`getLocale`](/docs/react/nextjs/reference/functions/get-locale), and [`getRegion`](/docs/react/nextjs/reference/functions/get-region).
- **The config plugin.** `withGTConfig` from `gt-next/config` wires internationalization into your build in `next.config`. See [Configuration](/docs/react/nextjs/config).
- **Middleware.** `gt-next/middleware` adds locale routing and detection with localized URL paths. Follow the [App Router](/docs/react/nextjs/app-router-middleware) or [Pages Router](/docs/react/nextjs/pages-router-middleware) guide.
- **Request locale registration.** Route Handlers and generated metadata images register locales before calling App Router server functions. See [Registering request locales](/docs/react/nextjs/registering-request-locales).
- **Localized navigation.** The `<Link>` component from `gt-next/link` prefixes internal hrefs with the active locale. See [Localized navigation](/docs/react/nextjs/link).

## Pages [#pages]

| Page | Description |
| --- | --- |
| [Server components](/docs/react/nextjs/server-components) | Translate in React Server Components and understand server vs. client behavior. |
| [`getGT`](/docs/react/nextjs/reference/functions/get-gt) | Start with the App Router-only `gt-next/server` function references. |
| [Configuration](/docs/react/nextjs/config) | The `withGTConfig` plugin, its options, and local vs. CDN translations. |
| [App Router middleware](/docs/react/nextjs/app-router-middleware) | Locale routing and the `app/[locale]` segment. |
| [Registering request locales](/docs/react/nextjs/registering-request-locales) | Register locale context in Route Handlers and generated metadata. |
| [Pages Router middleware](/docs/react/nextjs/pages-router-middleware) | Locale routing and the `pages/[locale]` segment. |
| [App Router static site generation](/docs/react/nextjs/app-router-static-site-generation) | Pre-render one App Router route per locale. |
| [Pages Router static site generation](/docs/react/nextjs/pages-router-static-site-generation) | Pre-render Pages Router pages with `withGTStaticProps`. |
| [Localized navigation](/docs/react/nextjs/link) | The locale-aware `<Link>` component from `gt-next/link`. |