React 應用程式的輕鬆本地化

您是否想將您的 React 應用程式擴展到新市場？TacoTranslate 讓本地化您的 React 應用變得非常簡單，助您輕鬆觸及全球觀眾。

為什麼選擇 TacoTranslate for React？

無縫整合：專為 React 應用程式設計，TacoTranslate 可輕鬆整合到您現有的工作流程中。
自動字串收集：不再需要手動管理 JSON 檔案。TacoTranslate 自動從您的程式碼庫中收集字串。
AI 驅動的翻譯：利用 AI 的力量，提供符合應用程式語氣的語境準確翻譯。
即時語言支援：只需點擊一下，即可新增新語言支援，讓您的應用程式可供全球使用。

它如何運作

透過 npm 安裝 TacoTranslate 套件：

npm install tacotranslate

安裝模組後，您需要建立一個 TacoTranslate 帳戶、一個翻譯專案，及相關的 API 金鑰。在此建立帳戶。完全免費，且不需要您提供信用卡資訊。

在 TacoTranslate 應用程式介面中，建立一個專案，並前往其 API 金鑰分頁。建立一個 read 金鑰及一個 read/write 金鑰。我們會將它們儲存為環境變數。 read 金鑰即所謂的 public，而 read/write 金鑰則是 secret。例如，你可以將它們新增到專案根目錄的 .env 檔案中。

你還需要添加兩個環境變數：TACOTRANSLATE_DEFAULT_LOCALE 和 TACOTRANSLATE_ORIGIN。

TACOTRANSLATE_DEFAULT_LOCALE：預設的備用語系代碼。在此範例中，我們將其設定為 en，代表英文。
TACOTRANSLATE_ORIGIN：儲存您的字串的「資料夾」，例如您的網站 URL。點此了解更多關於來源的資訊。

.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 驅動的翻譯確保語境準確且高品質的結果。
可擴展的解決方案：隨著應用程式和客戶群成長，輕鬆新增語言支援。

今天就開始吧！

當您在 Translate 組件中新增任何字串時，您的 React 應用程式將自動被翻譯。請注意，只有對 API 金鑰具有 read/write 權限的環境，才能建立新的翻譯字串。

我們建議您設置一個封閉且安全的預備環境，在上線前可以在此測試您的生產應用程式並新增字串。這樣可以防止任何人竊取您的祕密 API 金鑰，並避免因新增非法字串而使您的翻譯專案膨脹。

請務必查看我們 GitHub 頁面上的完整範例。如果您遇到任何問題，歡迎隨時聯繫我們，我們將非常樂意提供協助。

TacoTranslate 讓您能夠快速自動化地將您的 React 應用程式本地化至任何語言，亦支援從任何語言進行翻譯。免費翻譯！