Madaling lokalisasyon para sa mga aplikasyon ng React.

Paano ito gumagana

I-install ang pakete ng TacoTranslate gamit ang npm:

npm install tacotranslate

Kapag na-install mo na ang module, kailangan mong gumawa ng TacoTranslate account, isang proyekto ng pagsasalin, at mga kaugnay na API key. Gumawa ng account dito. Libre ito, at hindi nito kinakailangan na maglagay ka ng credit card.

Sa loob ng UI ng TacoTranslate application, gumawa ng isang proyekto at pumunta sa tab nito na API keys. Gumawa ng isang read key at isang read/write key. Ise-save namin ang mga ito bilang mga environment variable. Ang read key ang tinatawag naming public, at ang read/write key naman ay secret. Halimbawa, maaari mong idagdag ang mga ito sa isang .env file sa root ng iyong proyekto.

Kailangan mo ring magdagdag ng dalawang karagdagang environment variables: TACOTRANSLATE_DEFAULT_LOCALE at TACOTRANSLATE_ORIGIN.

• TACOTRANSLATE_DEFAULT_LOCALE: Ang default na code ng fallback locale. Sa halimbawang ito, itatakda namin ito sa en para sa Ingles.
• TACOTRANSLATE_ORIGIN: Ang “folder” kung saan ilalagay ang iyong mga string, tulad ng URL ng iyong website. Basahin pa ang tungkol sa mga origin dito.

TACOTRANSLATE_PUBLIC_API_KEY=123456
TACOTRANSLATE_SECRET_API_KEY=789010
TACOTRANSLATE_DEFAULT_LOCALE=en
TACOTRANSLATE_ORIGIN=your-website-url.com

Siguraduhing huwag kailanman ibunyag ang lihim na read/write API key sa mga client-side production environments.

Pagsasaayos ng TacoTranslate

I-initialize ang TacoTranslate sa iyong React application sa pamamagitan ng pagbabalot ng iyong application sa TacoTranslate context provider:

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>
	);
}

Maaari mo na ngayong gamitin ang Translate component kahit saan sa loob ng iyong aplikasyon upang ipakita ang isinaling teksto! Huwag kalimutang tingnan ang aming dokumentasyon para sa karagdagang impormasyon at para sa mga gabay sa implementasyon na partikular sa iyong setup.

import {Translate} from 'tacotranslate/react';

export default async function Component() {
	return (
		<Translate string="Hello? This is TacoTranslate speaking." />
	);
}

Mga Benepisyo ng Paggamit ng TacoTranslate

• Nakakatipid ng oras: Awtomatikong pinangangasiwaan ang nakakapagod na proseso ng lokalizasyon at pagkolekta ng mga string, kaya nakakatipid ka ng mahalagang oras.
• Makatipid sa gastos: Binabawasan ang pangangailangan para sa manwal na pagsasalin, na nagpapababa ng iyong gastusin sa lokalizasyon.
• Pinahusay na katumpakan: Tinitiyak ng mga pagsasalin na pinapagana ng AI ang kontekstuwal na katumpakan at mataas na kalidad na mga resulta.
• Nasusukat na solusyon: Madaling magdagdag ng suporta para sa mga bagong wika habang lumalago ang iyong aplikasyon at base ng mga customer.

Magsimula na ngayon!

Awtomatikong maisasalin ang iyong React application kapag nagdagdag ka ng anumang mga string sa isang Translate component. Tandaan na tanging mga environment na may mga read/write na pahintulot sa API key ang makakalikha ng mga bagong string na isasalin.

Inirerekomenda naming magkaroon ng isang sarado at ligtas na staging environment kung saan maaari mong subukan ang iyong production application at magdagdag ng mga bagong string bago ilunsad. Ito ay pipigil sa sinumang sinumang magnakaw ng iyong sekretong API key, at sa posibleng paglobo ng iyong proyekto ng pagsasalin dahil sa pagdaragdag ng mga hindi awtorisadong string.

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!