# gt-next: General Translation Next.js SDK: 移行
URL: https://generaltranslation.com/ja/docs/next/guides/migration.mdx
---
title: 移行
description: プロジェクトを gt-next に移行する方法を説明します
---
## 概要
このガイドでは、すでに i18n ライブラリを使用しているプロジェクトを gt-next へ移行する際に必要な手順を説明します。
あわせて、移行をできるだけスムーズに進めるためのヒントやポイントも紹介します。
## 前提条件
* 現在、別の i18n ライブラリを使用しているプロジェクト。
* `gt-next` ライブラリに関する基本的な知識。
## なぜ移行するのか？
プロジェクトを gt-next に移行したくなる理由はたくさんあります。
その一部を挙げると、次のとおりです。
* **JSON ファイルはもう不要:** 翻訳を JSON ファイルで管理する必要はもうありません。
すべてのコンテンツは、あるべき場所であるコード内にインラインで置けます。
* **自動翻訳:** CLI ツールを使って、高品質でコンテキストを考慮した翻訳を生成できます。
もう翻訳を待つ必要はありません。
* **開発中に試せる:** 翻訳のホットリロードにより、開発中でも簡単に翻訳を試せます。
## セットアップ
`gt-next` と `gt` CLI ツールをインストールします。
```bash
npm i gt-next gt
```
```bash
yarn add gt-next
yarn add --dev gt
```
```bash
bun add gt-next
bun add --dev gt
```
```bash
pnpm add gt-next
pnpm add --save-dev gt
```
プロジェクトのルートに、`defaultLocale` プロパティと `locales` 配列を含む `gt.config.json` ファイルを作成します。
```json title="gt.config.json" copy
{
"defaultLocale": "en",
"locales": ["en", "fr", "es"]
}
```
次に、アプリのルートレイアウトに `` コンポーネントを追加します。
```tsx title="app/layout.tsx" copy
import { GTProvider } from 'gt-next'
export default function RootLayout({ children }) {
return (
{children}
)
}
```
続いて、`next.config.js` ファイルに `withGTConfig` を追加します。
```js title="next.config.ts" copy
import { withGTConfig } from 'gt-next/config'
const nextConfig = {
// Your next.config.ts options
}
export default withGTConfig(nextConfig, {
// Your GT configuration
})
```
詳しい手順については、[クイックスタートガイド](/docs/next)を参照してください。
この時点で、選択肢は 3 つあります。
1. プロジェクト全体を `gt-next` に完全移行し、既存の i18n ライブラリを削除する。
2. プロジェクト全体を完全移行するが、既存の i18n ライブラリの辞書は引き続き使用する。
3. 当面は既存の i18n ライブラリを使い続け、プロジェクトの一部だけを `gt-next` に移行する。
各選択肢の詳細については、[移行戦略](#strategies) セクションを参照してください。
## 移行戦略 [#strategies]
### オプション 1: プロジェクト全体を完全に移行する
この方法が最もシンプルですが、その分、一度に最も多くのコード変更が必要になります。
プロジェクトのセットアップが完了したら、既存の i18n ライブラリを使っている箇所をすべて検索し、`gt-next` に置き換える必要があります。
アプリで `useTranslations` のような React フックを使っている場合は、コードベース内の `useTranslations` の使用箇所をすべて検索し、`useGT` に置き換えてください。
次に、すべての文字列キーを実際の文字列の値に置き換える必要があります。
たとえば、古いコードが次のようになっている場合:
```json title="dictionary.json"
{
"hello": {
"description": "Hello, world!"
}
}
```
```tsx
export default function MyComponent() {
const { t } = useTranslation()
return {t('hello.description')}
}
```
次のように置き換える必要があります：
```tsx
export default function MyComponent() {
const gt = useGT()
return {gt('Hello, world!')}
}
// または
export default function MyComponent() {
return Hello, world!
}
```
既存の i18n ライブラリを使っている箇所すべてに対して、これを行ってください.
### オプション 2: プロジェクト全体を移行しつつ、既存の i18n ライブラリの辞書は引き続き使う
たとえば、プロジェクトを `gt-next` に移行したい一方で、既存の i18n ライブラリの辞書はそのまま使い続け、
新しいコンテンツに対してのみ GT のインライン機能を使いたいとします。
この場合は、オプション 1 と同じような方法を取れます。
既存の i18n ライブラリを使っている箇所 (`useTranslations` フックなど) をすべて見つけて、`gt-next` の `useTranslations` フックに置き換えてください。
`useTranslations` フックの動作は、他の i18n ライブラリの `useTranslations` フックと非常によく似ているため、同じように使えます。
```tsx
import { useTranslation } from 'react-i18next'
export default function MyComponent() {
const { t } = useTranslation()
return {t('hello.description')}
}
```
```tsx
import { useTranslations } from 'gt-next'
export default function MyComponent() {
const t = useTranslations()
return {t('hello.description')}
}
```
設定については、プロジェクトのルートまたは `src` ディレクトリに `dictionary.[js|ts|json]` ファイルを作成する必要があります。
古い辞書ファイルの内容を、この新しいファイルにコピーしてください。
`next.config.js` の初期化関数 `withGTConfig` は、プロジェクトのルートまたは `src` ディレクトリにある辞書ファイルを自動的に検出します。
詳しくは、[dictionaries](/docs/next/guides/dictionaries) ガイドを参照してください。
### オプション 3: 当面は既存の i18n ライブラリを使い続け、プロジェクトの一部だけを `gt-next` に移行する
このオプションは最も柔軟で、一度に加えるコード変更も最小限で済みます。
この場合は、オプション 2 と同様の方法を取りつつ、プロジェクトの一部だけを `gt-next` に移行できます。
たとえば、一部のコンポーネントでは既存の i18n ライブラリを使い続け、他のコンポーネントや新しいコンテンツに対してのみ `gt-next` を使用できます。
このオプションは推奨されません。プロジェクト内で 2 つの異なる i18n ライブラリを管理する必要があり、複雑になるうえ、バグの原因になる可能性もあるためです。
## 移行のヒント
### 1. できるだけ `useGT` フックまたは `` コンポーネントを使用する
できるだけ `useGT` フックまたは `` コンポーネントを使用することをおすすめします。
こうしておくと、今後のコンテンツ編集がしやすくなり、コードベースの可読性も大幅に向上します。
### 2. 既存のコンテンツには `useTranslations` フックを使う
`useTranslations` フックは、既存の辞書をそのまま活用できる便利な方法です。
移行をしやすくするための手段として提供していますが、新しいコンテンツでの使用は推奨していません。
### 3. AIを活用する
AIを使ってプロジェクトの移行を進める場合は、次の場所から `LLMs.txt` と `LLMs-full.txt` を利用できます。
* [LLMs.txt](/llms.txt)
* [LLMs-full.txt](/llms-full.txt)