بهترین راهحل برای بینالمللیسازی (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: کد لوکال پیشفرض برای استفاده در صورت نیاز به بازگشت (fallback). در این مثال، آن را روی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 دارند قادر خواهند بود رشتههای جدیدی برای ترجمه ایجاد کنند.
توصیه میکنیم یک محیط استیجینگ بسته و امن داشته باشید تا بتوانید برنامهٔ تولیدی خود را تست کنید و قبل از انتشار، رشتههای جدید را اضافه نمایید. این کار از سرقت کلید 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!