Bezproblémová lokalizácia pre React aplikácie

Ako to funguje

Nainštalujte balík TacoTranslate cez npm:

npm install tacotranslate

Keď máte modul nainštalovaný, budete si musieť vytvoriť účet TacoTranslate, prekladateľský projekt a príslušné API kľúče. Tu si vytvorte účet. Je to zadarmo a nevyžaduje zadanie kreditnej karty.

V používateľskom rozhraní aplikácie TacoTranslate vytvorte projekt a prejdite na kartu API kľúčov. Vytvorte jeden read kľúč a jeden read/write kľúč. Uložíme ich ako premenné prostredia. read kľúč nazývame public a read/write kľúč je secret. Napríklad ich môžete pridať do súboru .env v koreňovom adresári vášho projektu.

Budete tiež potrebovať pridať ďalšie dve premenné prostredia: TACOTRANSLATE_DEFAULT_LOCALE a TACOTRANSLATE_ORIGIN.

• TACOTRANSLATE_DEFAULT_LOCALE: Predvolený kód záložného jazyka. V tomto príklade ho nastavíme na en pre angličtinu.
• TACOTRANSLATE_ORIGIN: „Zložka“, kde budú uložené vaše reťazce, napríklad URL adresa vašej webovej stránky. Viac o pôvodoch sa dozviete tu.

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

Nikdy nesmiete zverejniť tajný read/write API kľúč v produkčných prostrediach na strane klienta.

Nastavenie TacoTranslate

Inicializujte TacoTranslate vo vašej React aplikácii tak, že obalíte vašu aplikáciu do poskytovateľa kontextu 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>
	);
}

Teraz môžete použiť komponent Translate kdekoľvek vo vašej aplikácii na zobrazovanie preloženého textu! Nezabudnite si pozrieť našu dokumentáciu pre viac informácií a návody na implementáciu prispôsobené vášmu nastaveniu.

import {Translate} from 'tacotranslate/react';

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

Výhody používania TacoTranslate

• Úspora času: Automatizuje zdĺhavý proces lokalizácie a zbierania reťazcov, čím šetrí váš cenný čas.
• Nákladovo efektívne: Znižuje potrebu manuálnych prekladov, čím znižuje náklady na lokalizáciu.
• Zlepšená presnosť: Preklady poháňané umelou inteligenciou zaisťujú kontextovo presné a kvalitné výsledky.
• Škálovateľné riešenie: Jednoducho pridajte podporu nových jazykov, keď vaša aplikácia a zákaznícka základňa rastie.

Začnite už dnes!

Vaša React aplikácia bude automaticky preložená, keď pridáte ľubovoľné reťazce do komponentu Translate. Upozorňujeme, že vytvárať nové reťazce na preklad môžu len prostredia s oprávneniami read/write na API kľúči.

Odporúčame mať uzavreté a zabezpečené staging prostredie, kde môžete testovať svoju produkčnú aplikáciu a pridávať nové reťazce pred jej spustením do živého režimu. Toto zabráni komukoľvek ukradnúť váš tajný API kľúč a potenciálne nafúknuť váš prekladateľský projekt pridaním nežiadaných reťazcov.

Nezabudnite pozrieť si kompletné príklady na našom GitHub profile. Ak narazíte na akékoľvek problémy, neváhajte nás kontaktovať, radi vám pomôžeme.

TacoTranslate vám umožňuje automaticky lokalizovať vaše React aplikácie rýchlo do a z ľubovoľného jazyka. Prekladajte zadarmo!