# General Translation React SDKs (gt-react, gt-next): Next.js URL: https://generaltranslation.com/ja/docs/react/nextjs.mdx --- title: Next.js description: サーバーコンポーネント、サーバー関数、config プラグイン、ミドルウェア、リクエストロケールの登録、ローカライズされたナビゲーションなど、General Translation の Next.js 固有の機能を紹介します。 --- `gt-next` は、General Translation の React エコシステムの他の部分と同じコンポーネント、フック、設定を共有していますが、Next.js には他のフレームワークにはない機能がいくつかあります。これらのページでは、`gt-next` にのみ該当する部分を説明します。 使い始めたばかりの場合は、[Next.js App Router クイックスタート](/docs/react/nextjs-quickstart) または [Next.js Pages Router クイックスタート](/docs/react/nextjs-pages-router-quickstart) を参照してください。共通の [ガイド](/docs/react/guides/configuring) と [リファレンス](/docs/react/reference/config) では、フレームワーク間で共通して動作する内容を扱っています。ここにあるページでは、Next.js 固有の機能領域を扱います。 ## Next.js 固有の機能 [#overview] `gt-next` の大部分は共通の React API です。Next.js 専用の機能は次のとおりです。 * **サーバーコンポーネント。** App Router では、[``](/docs/react/reference/components/t) コンポーネントと翻訳フックは、`'use client'` ディレクティブなしで同期の React Server Components でも動作します。非同期コンポーネントでは `gt-next/server` の関数を使用します。詳しくは [Server components](/docs/react/nextjs/server-components) を参照してください。 * **サーバー関数。** App Router 専用の `gt-next/server` エントリでは、[`getGT`](/docs/react/nextjs/reference/functions/get-gt)、[`getLocale`](/docs/react/nextjs/reference/functions/get-locale)、[`getRegion`](/docs/react/nextjs/reference/functions/get-region) などの非同期関数を提供します。 * **config プラグイン。** `gt-next/config` の `withGTConfig` は、`next.config` で国際化をビルドに組み込みます。詳しくは [Configuration](/docs/react/nextjs/config) を参照してください。 * **ミドルウェア。** `gt-next/middleware` は、ローカライズされた URL パスによるロケールルーティングとロケール検出を追加します。[App Router](/docs/react/nextjs/app-router-middleware) または [Pages Router](/docs/react/nextjs/pages-router-middleware) のガイドに従ってください。 * **リクエストロケールの登録。** Route Handlers と生成されるメタデータ画像では、App Router のサーバー関数を呼び出す前にロケールを登録します。詳しくは [Registering request locales](/docs/react/nextjs/registering-request-locales) を参照してください。 * **ローカライズされたナビゲーション。** `gt-next/link` の `` コンポーネントは、内部 href にアクティブなロケールのプレフィックスを付けます。詳しくは [Localized navigation](/docs/react/nextjs/link) を参照してください。 ## ページ [#pages] | ページ | 説明 | | --------------------------------------------------------------------------------------------- | ------------------------------------------------------- | | [Server components](/docs/react/nextjs/server-components) | React Server Components で翻訳し、サーバーとクライアントの挙動の違いを理解します。 | | [`getGT`](/docs/react/nextjs/reference/functions/get-gt) | App Router 専用の `gt-next/server` 関数リファレンスから始めましょう。 | | [Configuration](/docs/react/nextjs/config) | `withGTConfig` プラグイン、そのオプション、ローカル翻訳と CDN 翻訳について説明します。 | | [App Router middleware](/docs/react/nextjs/app-router-middleware) | ロケールルーティングと `app/[locale]` セグメント。 | | [Registering request locales](/docs/react/nextjs/registering-request-locales) | ルートハンドラーと生成されるメタデータでロケールコンテキストを登録します。 | | [Pages Router middleware](/docs/react/nextjs/pages-router-middleware) | ロケールルーティングと `pages/[locale]` セグメント。 | | [App Router static site generation](/docs/react/nextjs/app-router-static-site-generation) | ロケールごとに App Router ルートを 1 つずつ事前レンダリングします。 | | [Pages Router static site generation](/docs/react/nextjs/pages-router-static-site-generation) | `withGTStaticProps` を使って Pages Router のページを事前レンダリングします。 | | [Localized navigation](/docs/react/nextjs/link) | `gt-next/link` のロケール対応 `` コンポーネント。 |