بهترین راهحل برای بینالمللیسازی (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: «پوشهای» که رشتههای شما در آن ذخیره میشوند، مانند آدرس (URL) وبسایت شما. برای اطلاعات بیشتر دربارهٔ origins اینجا را بخوانید.
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 خود با قرار دادن برنامهٔ خود داخل Provider کانتکست 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
- صرفهجویی در زمان: فرآیند وقتگیر بومیسازی و جمعآوری رشتهها را خودکار میکند و باعث صرفهجویی در زمان ارزشمند شما میشود.
- مقرونبهصرفه: نیاز به ترجمههای دستی را کاهش میدهد و هزینههای بومیسازی شما را پایین میآورد.
- دقت بالاتر: ترجمههای مبتنی بر هوش مصنوعی نتایجی متناسب با زمینه و با کیفیت بالا را تضمین میکنند.
- راهحل مقیاسپذیر: با رشد برنامه و پایگاه مشتریانتان، بهراحتی میتوانید پشتیبانی از زبانهای جدید را اضافه کنید.
همین امروز شروع کنید!
برنامهٔ React شما بهصورت خودکار ترجمه میشود زمانی که هر رشتهای را به کامپوننت Translate اضافه کنید. توجه داشته باشید که تنها محیطهایی که برای کلید API مجوز read/write را دارند قادر خواهند بود رشتههای جدیدی برای ترجمه ایجاد کنند.
ما توصیه میکنیم یک محیط staging بسته و امن داشته باشید تا بتوانید برنامهٔ تولیدی خود را آزمایش کرده و قبل از رفتن به محیط زنده، رشتههای جدید را اضافه کنید. این کار از سرقت کلید 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!