TacoTranslate
/
ドキュメンテーション価格情報
 
記事
5月04日

Reactアプリケーションのための手間いらずのローカリゼーション

Reactアプリケーションを新しい市場に展開したいとお考えですか？TacoTranslateを使えば、Reactアプリを簡単にローカライズでき、手間をかけずにグローバルなユーザーにリーチすることができます。

ReactにTacoTranslateを選ぶ理由は？

  • シームレスな統合: Reactアプリケーション向けに特別に設計されており、TacoTranslateは既存のワークフローに簡単に統合されます。
  • 自動文字列収集: JSONファイルを手動で管理する必要はありません。TacoTranslateはコードベースから自動的に文字列を収集します。
  • AI搭載の翻訳: AIの力を活用し、アプリケーションのトーンに合った文脈的に正確な翻訳を提供します。
  • 即時の言語サポート: クリック一つで新しい言語のサポートを追加し、アプリケーションをグローバルに利用可能にします。

仕組み

npmを使ってTacoTranslateパッケージをインストールします：

npm install tacotranslate

モジュールをインストールしたら、TacoTranslateアカウント、翻訳プロジェクト、および関連するAPIキーを作成する必要があります。ここでアカウントを作成してください。 無料で、クレジットカードの登録は不要です。

TacoTranslate アプリケーションの UI 内で、プロジェクトを作成し、その API キーのタブに移動します。 read キーを1つ、そして read/write キーを1つ作成します。これらは環境変数として保存します。read キーは public と呼ばれ、read/write キーは secret と呼ばれます。例えば、プロジェクトのルートにある .env ファイルに追加することができます。

さらに、2つの環境変数 TACOTRANSLATE_DEFAULT_LOCALE と TACOTRANSLATE_ORIGIN を追加する必要があります。

.env
TACOTRANSLATE_PUBLIC_API_KEY=123456
TACOTRANSLATE_SECRET_API_KEY=789010
TACOTRANSLATE_DEFAULT_LOCALE=en
TACOTRANSLATE_ORIGIN=your-website-url.com

クライアント側の本番環境に秘密の read/write APIキーを決して漏らさないようにしてください。

TacoTranslate の設定

ReactアプリケーションでTacoTranslateを初期化するには、アプリケーションをTacoTranslateコンテキストプロバイダーでラップします：

import React, {useState} from 'react';
import TacoTranslate, {Translate} from 'tacotranslate/react';

const tacoTranslate = createTacoTranslateClient({
	apiKey: 'YOUR_API_KEY',
});

export default function App() {
	const [locale, setLocale] = useState('en');

	return (
		<TacoTranslate client={tacoTranslate} locale={locale}>
			<Translate string="Hello, world!"/>
		</TacoTranslate>
	);
}

あなたのアプリケーション内のどこでも Translate コンポーネントを使って翻訳されたテキストを表示できるようになりました！詳細や特定のセットアップに関する実装ガイドについては、ぜひ当社のドキュメントをご覧ください。

import {Translate} from 'tacotranslate/react';

export default async function Component() {
	return (
		<Translate string="Hello? This is TacoTranslate speaking." />
	);
}

TacoTranslateを使用する利点

  • 時間の節約：ローカリゼーションと文字列収集の面倒な作業を自動化し、貴重な時間を節約します。
  • コスト効率：手動翻訳の必要性を減らし、ローカリゼーションコストを削減します。
  • 精度の向上：AIによる翻訳で、文脈に即した正確で高品質な結果を提供します。
  • スケーラブルなソリューション：アプリケーションや顧客基盤の成長に合わせて、新しい言語のサポートを簡単に追加できます。

さっそく始めましょう！

あなたのReactアプリケーションは、Translateコンポーネントに文字列を追加すると自動的に翻訳されます。APIキーに対してread/write権限を持つ環境のみが、新しい翻訳用の文字列を作成できることに注意してください。

本番アプリケーションを公開する前に新しい文字列を追加してテストできる、閉鎖された安全なステージング環境を持つことをお勧めします。これにより、誰かがあなたの秘密のAPIキーを盗んだり、不正な文字列を追加して翻訳プロジェクトが膨らんだりするのを防げます。

必ずGitHubのプロフィールにある完全な例をご覧ください。もし何か問題があれば、遠慮なくお問い合わせください。喜んでサポートいたします。

TacoTranslateは、あなたのReactアプリケーションを任意の言語間で迅速に自動ローカライズすることを可能にします。無料で翻訳しましょう！

Nattskiftet の製品