# General Translation React SDKs (gt-react, gt-next): useGT
URL: https://generaltranslation.com/ja/docs/react/reference/hooks/use-gt.mdx
---

title: useGT
description: General Translation gt-react で文字列をインラインで翻訳する関数を取得します。useGT の API リファレンス。

---

`useGT` hook は、文字列をアクティブなロケールに翻訳する関数を返します。[`<T>`](/docs/react/reference/components/t) が適さない場合に、ラベル、プレースホルダー、その他の単独の文字列に使用します。

*`gt-react`、`gt-next`、`gt-tanstack-start`、`gt-react-native` で利用できます。例では `gt-react` から import していますが、実際にはお使いのフレームワークのパッケージから import してください。*

## 概要 [#overview]

`useGT` を呼び出して翻訳関数を取得し、その関数に文字列を渡します。翻訳関数はそのまま返されます。

```tsx
const gt = useGT();

<p>{gt('This text will be translated')}</p>;
```

*注: `gt-react` では、[`<GTProvider>`](/docs/react/reference/components/gt-provider) 配下で `useGT` を呼び出してください。`gt-next` では、同期的なサーバーコンポーネント内でも使えます。`const gt = useGT()` のように書いてください。返されるのはオブジェクトではなく、関数そのものです。*

## 仕組み [#how-it-works]

* **ビルド時の翻訳。** 本番環境では、`gt` に渡された文字列はデプロイ前のビルド時に翻訳されます。翻訳できるのは、ビルド時点で判明しているコンテンツだけです。翻訳がない場合は、元の文字列がそのまま使われます。
* **開発環境では オンデマンド。** 開発用 API キーを使うと、`gt` は オンデマンド で翻訳するため、少し遅延はありますが、ロケールをプレビューできます。この遅延は本番環境では発生しません。
* **変数は翻訳されません。** 補間値は翻訳後の文字列に挿入されますが、それ自体が翻訳されることはありません。

## パラメータ [#parameters]

`useGT` にパラメータはありません。

## 戻り値 [#returns]

**型** `(content: string, options?: InlineTranslationOptions) => string`

指定した文字列をアクティブなロケールに翻訳する関数です。

| 名前        | 説明                                            | 型                                                                                    | 任意  |
| --------- | --------------------------------------------- | ------------------------------------------------------------------------------------ | --- |
| `content` | 翻訳する文字列コンテンツです。                               | `string`                                                                             | いいえ |
| `options` | `$context`、`$id`、`$maxChars` などの補間変数とオプションです。 | [`InlineTranslationOptions`](/docs/react/reference/types/inline-translation-options) | はい  |

## 例 [#examples]

```tsx
import { useGT } from 'gt-react';

export default function TranslateGreeting() {
  const gt = useGT();
  return <p>{gt('Hello, Alice!')}</p>;
}
// "Hello, Alice!" はユーザーのロケールに翻訳されます。
```

```tsx
import { useGT } from 'gt-react';

export default function TranslateGreeting() {
  const gt = useGT();
  return <p>{gt('Hello, {name}!', { name: 'Alice' })}</p>;
}
// "Alice" は変数のため、翻訳されません。
```

```tsx
import { useGT } from 'gt-react';

export default function ItemCount() {
  const gt = useGT();
  return (
    <p>
      {gt(
        'There are {count, plural, =0 {no items} =1 {one item} other {{count} items}} in the cart',
        { count: 10 }
      )}
    </p>
  );
}
```

`gt-react` は、変数の書式設定用に [ICU message format](https://unicode-org.github.io/icu/userguide/format_parse/messages/) に対応しています。

## メモ [#notes]

* `useGT` は文字列を翻訳します。翻訳はビルド時に行われ、開発時にはオンデマンドで実行されます。
* 非同期の App Router コンポーネントでは、代わりに [`getGT`](/docs/react/nextjs/reference/functions/get-gt) を使用してください。
* dictionary を使って id で参照する場合は [`useTranslations`](/docs/react/reference/hooks/use-translations) を使用してください。モジュールスコープで文字列を登録する場合は、[`useMessages`](/docs/react/reference/hooks/use-messages) と一緒に [`msg`](/docs/react/reference/functions/msg) を使用してください。