بهترین راهحل برای بینالمللیسازی (i18n) در برنامههای React
آیا میخواهید برنامه React خود را به بازارهای جدید گسترش دهید؟ TacoTranslate محلیسازی برنامههای React شما را بسیار آسان میکند و به شما امکان میدهد بدون دردسر به مخاطبان جهانی دسترسی پیدا کنید.
چرا TacoTranslate را برای React انتخاب کنید؟
- ادغام یکپارچه: بهطور ویژه برای برنامههای React طراحی شده است؛ TacoTranslate بهآسانی در جریان کاری موجود شما ادغام میشود.
- جمعآوری خودکار رشتهها: دیگر نیازی به مدیریت دستی فایلهای JSON نیست. TacoTranslate رشتهها را بهصورت خودکار از کدپایهٔ شما جمعآوری میکند.
- ترجمههای مجهز به هوش مصنوعی: از قدرت هوش مصنوعی استفاده کنید تا ترجمههایی متناسب با زمینه و لحن برنامهٔ شما ارائه شوند.
- پشتیبانی فوری از زبانها: فقط با یک کلیک پشتیبانی از زبانهای جدید را اضافه کنید و برنامهٔ خود را در سطح جهانی در دسترس قرار دهید.
نحوه کار
بستهٔ TacoTranslate را از طریق npm نصب کنید:
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: “پوشه” که رشتههای شما در آن ذخیره خواهند شد، مانند آدرس وبسایت شما. برای اطلاعات بیشتر در مورد مبداها اینجا را بخوانید.
TACOTRANSLATE_PUBLIC_API_KEY=123456
TACOTRANSLATE_SECRET_API_KEY=789010
TACOTRANSLATE_DEFAULT_LOCALE=en
TACOTRANSLATE_ORIGIN=your-website-url.comاطمینان حاصل کنید که هرگز کلید API محرمانه read/write را در محیطهای تولیدی سمت کلاینت فاش نکنید.
راهاندازی TacoTranslate
TacoTranslate را در برنامهٔ React خود با قرار دادن برنامهتان درون ارائهدهندهٔ کانتکست 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
- صرفهجویی در زمان: فرآیند خستهکنندهٔ بومیسازی و جمعآوری رشتهها را خودکار میسازد و در وقت شما صرفهجویی میکند.
- مقرونبهصرفه: نیاز به ترجمهٔ دستی را کاهش میدهد و هزینههای بومیسازی شما را کمتر میکند.
- افزایش دقت: ترجمههای مبتنی بر هوش مصنوعی نتایج دقیق از نظر زمینه و با کیفیت بالا را تضمین میکنند.
- راهکار مقیاسپذیر: با رشد برنامه و پایهٔ مشتریانتان، بهراحتی پشتیبانی از زبانهای جدید را اضافه کنید.
همین امروز شروع کنید!
هنگامی که هر رشتهای را به یک کامپوننت Translate اضافه کنید، برنامهٔ React شما بهطور خودکار ترجمه خواهد شد. توجه داشته باشید که تنها محیطهایی که دسترسیهای read/write روی کلید API دارند، قادر به ایجاد رشتههای جدید برای ترجمه خواهند بود.
ما توصیه میکنیم یک محیط مرحلهبندی بسته و امن داشته باشید تا بتوانید برنامهٔ تولیدی خود را آزمایش کنید و قبل از انتشار، رشتههای جدید را اضافه نمایید. این کار از دزدیده شدن کلید API محرمانهٔ شما توسط هر کسی جلوگیری میکند و همچنین از پر شدن بیرویهٔ پروژهٔ ترجمهٔ شما بهخاطر اضافه شدن رشتههای نامربوط جلوگیری میکند.
Be sure to check out the complete examples over at our GitHub profile. If you encounter any problems, feel free to reach out, and we’ll be more than happy to help.
TacoTranslate lets you automatically localize your React applications quickly to and from over 75 languages. Translate for free!