TacoTranslate
/
DokumentaceCeník
 
Článek
04. 5.

Nejlepší řešení pro internacionalizaci (i18n) v aplikacích React

Chcete rozšířit svou React aplikaci na nové trhy? TacoTranslate činí lokalizaci vašich React aplikací neuvěřitelně jednoduchou a umožňuje vám oslovit globální publikum bez starostí.

Proč si vybrat TacoTranslate pro React?

  • Bezproblémová integrace: Navrženo speciálně pro aplikace v Reactu, TacoTranslate se bez námahy integruje do vašeho stávajícího pracovního postupu.
  • Automatické sbírání textových řetězců: Už žádné ruční spravování JSON souborů. TacoTranslate automaticky sbírá řetězce z vašeho kódového základu.
  • Překlady poháněné AI: Využijte sílu umělé inteligence k zajištění kontextově přesných překladů, které odpovídají tónu vaší aplikace.
  • Okamžitá podpora jazyků: Přidejte podporu nových jazyků jediným kliknutím a zajistěte tak globální dostupnost vaší aplikace.

Jak to funguje

Nainstalujte balíček TacoTranslate pomocí npm:

npm install tacotranslate

Jakmile budete mít modul nainstalovaný, budete muset vytvořit účet TacoTranslate, překladový projekt a související API klíče. Vytvořte si účet zde. Je to zdarma a nevyžaduje zadání kreditní karty.

V uživatelském rozhraní aplikace TacoTranslate vytvořte projekt a přejděte na kartu s API klíči. Vytvořte jeden read klíč a jeden read/write klíč. Uložíme je jako proměnné prostředí. Klíč read nazýváme public a klíč read/write je secret. Například je můžete přidat do souboru .env v kořenovém adresáři vašeho projektu.

Budete také muset přidat ještě dvě proměnné prostředí: TACOTRANSLATE_DEFAULT_LOCALE a TACOTRANSLATE_ORIGIN.

  • TACOTRANSLATE_DEFAULT_LOCALE: Výchozí kód záložní lokalizace. V tomto příkladu jej nastavíme na en pro angličtinu.
  • TACOTRANSLATE_ORIGIN: “Složka”, kde budou uloženy vaše řetězce, například URL vaší webové stránky. Zde se dozvíte více o původech.
.env
TACOTRANSLATE_PUBLIC_API_KEY=123456
TACOTRANSLATE_SECRET_API_KEY=789010
TACOTRANSLATE_DEFAULT_LOCALE=en
TACOTRANSLATE_ORIGIN=your-website-url.com

Ujistěte se, že tajný read/write API klíč se nikdy nedostane do produkčního prostředí na straně klienta.

Nastavení TacoTranslate

Inicializujte TacoTranslate ve své React aplikaci tím, že obalíte aplikaci poskytovatelem 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>
	);
}

Nyní můžete komponentu Translate použít kdekoli ve své aplikaci k zobrazení přeloženého textu! Nezapomeňte se podívat na naši dokumentaci pro více informací a návody k implementaci specifické pro vaše nastavení.

import {Translate} from 'tacotranslate/react';

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

Výhody používání TacoTranslate

  • Úspora času: Automatizuje únavný proces lokalizace a shromažďování textových řetězců, čímž vám šetří cenný čas.
  • Nákladově efektivní: Snižuje potřebu ručních překladů a tím i náklady na lokalizaci.
  • Zvýšená přesnost: Překlady poháněné AI zajišťují kontextově přesné a vysoce kvalitní výsledky.
  • Škálovatelné řešení: Snadno přidáte podporu nových jazyků, jak vaše aplikace a zákaznická základna porostou.

Začněte ještě dnes!

Vaše React aplikace se bude automaticky překládat, když do komponenty Translate přidáte jakékoliv řetězce. Všimněte si, že pouze prostředí s oprávněním read/write u API klíče budou moci vytvářet nové řetězce k překladu.

Doporučujeme mít uzavřené a zabezpečené stagingové prostředí, kde můžete testovat svou produkční aplikaci a přidávat nové řetězce před jejím nasazením. To zabrání komukoli komukoli ukrást váš tajný API klíč a potenciálně nafouknout váš překladatelský projekt přidáváním nežádoucích řetězců.

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!

Produkt od NattskiftetVyrobeno v Norsku