# react-native: useGT
URL: https://generaltranslation.com/ja/docs/react-native/api/strings/use-gt.mdx
---
title: useGT
description: useGT の文字列翻訳関数に関する API リファレンス
---

{/* 自動生成: 直接編集せず、代わりに content/docs-templates/ 内の template を編集してください。 */}


## 概要

`useGT` は、ビルド時に文字列を翻訳するための Hook です。

```jsx
const gt = useGT();

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

<Callout>
  **ビルド時翻訳:** `useGT` の翻訳は、アプリのデプロイ前、ビルド時に実行されます。翻訳対象の文字列に変数を渡すことはできますが、翻訳できるのはビルド時点で確定している内容のみです。
</Callout>


## リファレンス

### パラメータ

なし

### 戻り値

指定された内容を翻訳するコールバック関数 `gt`。

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

| 名前         | 型                                                                                     | 説明                           |
| ---------- | ------------------------------------------------------------------------------------- | ---------------------------- |
| `content`  | `string`                                                                              | 翻訳対象の文字列コンテンツ。               |
| `options?` | [`InlineTranslationOptions`](/docs/react-native/api/types/inline-translation-options) | `gt` の動作をカスタマイズするための翻訳オプション。 |

***


## 挙動

### 本番環境

CD プロセスでは、`gt` 関数内のコンテンツはすべて、アプリケーションのデプロイ前に翻訳されます。
これにより、すべてのロケールで高速な読み込みを実現できますが、翻訳できるのはビルド時に判明しているコンテンツに限られます。

生成された翻訳は、設定に応じて (1) CDN に保存されるか、(2) アプリのビルド出力に保存されます。
その後、翻訳済みのコンテンツがユーザーに配信されます。
翻訳が見つからない場合は、元のコンテンツにフォールバックします。

必ず[こちらのデプロイガイド](/docs/react-native/tutorials/quickdeploy)に従ってください。

### 開発

開発中は、`gt` 関数がコンテンツを on-demand で翻訳します。
これは、アプリが各言語でどのように表示されるかを試す際に便利です。
この動作を有効にするには、環境変数に Dev API キーを追加してください。

開発時に on-demand 翻訳を行うと、遅延が発生します。
本番ビルドでは、コンテンツを明示的に on-demand で翻訳している場合を除き、この遅延は発生しません。

***

## 例

### 基本的な使い方

`useGT` を使って文字列を翻訳できます。

```jsx copy
import { useGT } from 'gt-react-native';

export default function TranslateGreeting() {
  const gt = useGT();

  return <p>{gt('Hello, Alice!')}</p>;
}
```

注: &quot;Alice&quot; はユーザーの優先言語に翻訳されます。


### 変数の使用 [#variables]

辞書の翻訳文に変数を渡せます。

```jsx copy
import { useGT } from 'gt-react-native';

export default function TranslateGreeting() {
  const gt = useGT();

  return <p>{gt('Hello, {name}!', { name: 'Alice' })}</p>;
}
```

注: &quot;Alice&quot; は変数であるため、ユーザーの優先言語には翻訳されません。

### ICU メッセージ形式を使う

`gt-react-native` は ICU メッセージ形式に対応しており、変数の書式設定も行えます。

```jsx copy
import { useGT } from 'gt-react-native';

export default function TranslateGreeting() {
  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>
  );
}
```

<Callout>
  ICU メッセージ形式は、変数を柔軟にフォーマットできる強力な方法です。詳しくは、
  [ICU メッセージ形式の
  ドキュメント](https://unicode-org.github.io/icu/userguide/format_parse/messages/)を参照してください。
</Callout>


### `gt-react-native` からのインポート

`"use client"` ディレクティブを使用している場合は、`gt-react-native` ではなく `gt-react-native` からインポートする必要があります。

```jsx copy
'use client';
import { useGT } from 'gt-react-native';

export default function TranslateGreeting() {
  const gt = useGT();

  return <p>{gt('Hello, Alice!')}</p>;
}
```

***


## 注記

* `useGT` 関数は、文字列を翻訳するための Hook です。
* `useGT` による文字列の翻訳は、開発時を除き、runtime より前のビルドプロセス中に行われます。