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

Chcete rozšířit svou React aplikaci na nové trhy? TacoTranslate velmi usnadňuje lokalizaci vašich React aplikací a umožňuje vám oslovit globální publikum bez zbytečných komplikací.

Proč zvolit TacoTranslate pro React?

Bezproblémová integrace: Navrženo speciálně pro React aplikace, TacoTranslate se bez námahy integruje do vašeho stávajícího pracovního toku.
Automatické shromažďování řetězců: Už nemusíte ručně spravovat soubory JSON. TacoTranslate automaticky sbírá řetězce z vašeho kódu.
Překlady poháněné AI: Využijte sílu AI k poskytování kontextově přesných překladů, které odpovídají tónu vaší aplikace.
Okamžitá podpora jazyků: Přidejte podporu nových jazyků jedním kliknutím a zpřístupněte tak vaši aplikaci celému světu.

Jak to funguje

Nainstalujte balíček TacoTranslate pomocí npm:

npm install tacotranslate

Po nainstalování modulu si budete muset vytvořit účet na TacoTranslate, překladový projekt a příslušné API klíče. Vytvořte si účet zde. Je to zdarma a nevyžaduje zadání platební karty.

V uživatelském rozhraní aplikace TacoTranslate vytvořte projekt a přejděte na záložku API klíčů. Vytvořte jeden read klíč, a jeden read/write klíč. Uložíme je jako proměnné prostředí. read klíč je to, čemu říkáme public a read/write klíč je secret. Například je můžete přidat do souboru .env v kořeni vašeho projektu.

Budete také potřebovat přidat další 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šeho webu. Více informací o originách najdete zde.

.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 kdekoliv ve své aplikaci použít komponentu Translate k zobrazení přeloženého textu! Nezapomeňte si pro více informací a implementační návody přizpůsobené vašemu nastavení prohlédnout naši dokumentaci.

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í ř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.
Zlepšená přesnost: Překlady poháněné umělou inteligencí 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 rostou.

Začněte ještě dnes!

Vaše React aplikace bude automaticky přeložena, když do komponenty Translate přidáte jakékoli řetězce. Všimněte si, že pouze prostředí s oprávněním read/write na API klíči budou schopna vytvářet nové řetězce k překladu.

Doporučujeme mít uzavřené a zabezpečené stagingové prostředí, kde můžete otestovat produkční aplikaci a přidávat nové řetězce ještě před uvedením do provozu. To zabrání komukoli komukoli ukrást váš tajný API klíč a potenciálně nafouknout váš překladový projekt přidáváním neautorizovaný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!