Bezproblémová lokalizace aplikací v Reactu

Jak to funguje

Nainstalujte balíček TacoTranslate pomocí npm:

npm install tacotranslate

Když máte modul nainstalovaný, budete si 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í kreditní karty.

V uživatelském rozhraní aplikace TacoTranslate vytvořte projekt a přejděte na záložku API klíče. 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.

Také budete muset přidat další dvě proměnné prostředí: TACOTRANSLATE_DEFAULT_LOCALE a TACOTRANSLATE_ORIGIN.

• TACOTRANSLATE_DEFAULT_LOCALE: Výchozí kód náhradního (fallback) locale. V tomto příkladu jej nastavíme na en pro angličtinu.
• TACOTRANSLATE_ORIGIN: „Složka“, kde budou vaše řetězce uloženy, například URL vaší webové stránky. Přečtěte si více o origins zde.

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

Ujistěte se, že nikdy nezveřejníte tajný read/write API klíč v produkčním prostředí na straně klienta.

Nastavení TacoTranslate

Inicializujte TacoTranslate ve své React aplikaci tak, ž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! Určitě si pro více informací a návody k implementaci přizpůsobené vašemu nastavení prohlédněte 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 sběru řetězců, čímž vám šetří drahocenný č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řidejte podporu nových jazyků, jak vaše aplikace a zákaznická základna porostou.

Začněte ještě dnes!

Vaše React aplikace bude přeložena automaticky, když přidáte jakékoli řetězce do komponenty Translate. Mějte na paměti, že pouze prostředí s oprávněním read/write u API klíče budou moci vytvářet nové řetězce určené 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 nasazením do provozu. Tím zabráníte tomu, aby někdo ukradl váš tajný API klíč a případně zahltil váš překladový 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!