Madaling paglokalisa para sa mga React na aplikasyon

Paano ito gumagana

I-install ang pakete ng TacoTranslate gamit ang npm:

npm install tacotranslate

Kapag na-install mo na ang module, kakailanganin mong gumawa ng TacoTranslate account, isang proyekto para sa pagsasalin, at mga kaugnay na API keys. Gumawa ng account dito. Libre ito, at hindi kailangan ng credit card.

Sa loob ng TacoTranslate application UI, gumawa ng isang proyekto, at pumunta sa tab ng mga API key nito. Gumawa ng isang read key, at isang read/write key. Ise-save namin ang mga ito bilang mga environment variables. Ang read key ay tinatawag naming public at ang read/write key ay secret. Halimbawa, maaari mo silang idagdag 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 fallback locale code. Sa halimbawa na ito, itatakda natin ito sa en para sa Ingles.
• TACOTRANSLATE_ORIGIN: Ang “folder” kung saan ise-save ang iyong mga string, tulad ng URL ng iyong website. Basahin pa ang tungkol sa origins dito.

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

Tiyaking huwag kailanman ilabas ang lihim na read/write API key sa mga client side production environments.

Pagsisimula sa TacoTranslate

I-initialize ang TacoTranslate sa iyong React application sa pamamagitan ng pag-wrap 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 nang gamitin ang Translate component kahit saan sa loob ng iyong aplikasyon upang ipakita ang isinaling teksto! Siguraduhing tingnan ang aming dokumentasyon para sa karagdagang impormasyon, at para sa mga gabay sa pagpapatupad na naaayon 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: Ino-automate ang nakakapagod na proseso ng lokalizasyon at pagkolekta ng mga string, na nagse-save ng mahalagang oras mo.
• Abot-kayang Gastos: Binabawasan ang pangangailangan para sa manwal na pagsasalin, kaya bumababa ang gastos sa lokalizasyon.
• Pinahusay na Katumpakan: Tinitiyak ng AI-powered na mga pagsasalin ang kontekstuwal na katumpakan at mataas na kalidad ng resulta.
• Nasusukat na Solusyon: Madaling magdagdag ng suporta para sa mga bagong wika habang lumalaki ang iyong aplikasyon at base ng mga customer.

Magsimula na ngayon!

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

Inirerekomenda naming magkaroon ng isang sarado at seguradong staging environment kung saan maaari mong subukan ang iyong production application, at magdagdag ng mga bagong string bago ito ilabas. Mapipigilan nito ang sinumang magnakaw ng iyong lihim na API key, at posibleng maiiwasan ang pagdami ng hindi nais na mga string sa iyong proyekto ng pagsasalin.

Tiyaking tingnan ang kumpletong mga halimbawa sa aming GitHub profile. Kung mayroon kang anumang problema, huwag mag-atubiling makipag-ugnayan, at ikalulugod naming tumulong.

Pinapayagan ka ng TacoTranslate na awtomatikong i-localize ang iyong mga React application nang mabilis sa kahit anong wika. Mag-translate nang libre!