React 應用程式的輕鬆本地化
您是否正在尋求將您的 React 應用擴展到新的市場?TacoTranslate 讓您的 React 應用本地化變得非常簡單,助您輕鬆觸及全球用戶,無需繁瑣步驟。
為什麼選擇 TacoTranslate 用於 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。在此閱讀更多關於來源的資訊。
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 應用程式將自動進行翻譯。請注意,只有擁有 read/write
權限的 API 金鑰環境,才能建立新的字串以供翻譯。
我們建議您使用封閉且安全的測試環境來測試您的生產應用程式,在正式上線前新增字串。這將防止任何人竊取您的秘密 API 金鑰,並可能藉由添加惡意字串而膨脹您的翻譯專案。
請務必在我們的 GitHub 頁面查看完整範例。如果您遇到任何問題,歡迎隨時聯繫我們,我們將非常樂意為您提供協助。
TacoTranslate 讓您能夠快速自動將 React 應用程式本地化至任何語言,並從任何語言進行翻譯。免費翻譯!