Nejlepší řešení pro internacionalizaci (i18n) v aplikacích React
Hledáte způsob, jak rozšířit svou React aplikaci na nové trhy? TacoTranslate výrazně usnadňuje lokalizaci vašich React aplikací a umožní vám oslovit globální publikum bez starostí.
Proč zvolit TacoTranslate pro React?
- Bezproblémová integrace: Navrženo speciálně pro aplikace React, TacoTranslate se bez námahy integruje do vašeho stávajícího pracovního postupu.
- Automatické shromažďování řetězců: Už žádné ruční spravování souborů JSON. TacoTranslate automaticky shromažďuje řetězce z vašeho kódu.
- Překlady poháněné umělou inteligencí: 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ů jedním kliknutím a udělejte vaši aplikaci dostupnou celosvětově.
Jak to funguje
Nainstalujte balíček TacoTranslate pomocí npm:
npm install tacotranslateJakmile máte modul nainstalovaný, budete muset vytvořit účet 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 kartu s API klíči. 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řenovém adresáři vašeho projektu.
Budete také muset přidat dvě další proměnné prostředí: TACOTRANSLATE_DEFAULT_LOCALE a TACOTRANSLATE_ORIGIN.
TACOTRANSLATE_DEFAULT_LOCALE: Výchozí kód náhradního jazyka. V tomto příkladu ho nastavíme naenpro angličtinu.TACOTRANSLATE_ORIGIN: “folder”, kde budou vaše řetězce uloženy, například URL vaší webové stránky. Více informací o originách najdete zde.
TACOTRANSLATE_PUBLIC_API_KEY=123456
TACOTRANSLATE_SECRET_API_KEY=789010
TACOTRANSLATE_DEFAULT_LOCALE=en
TACOTRANSLATE_ORIGIN=your-website-url.comDbejte na to, aby se tajný read/write API klíč nikdy nedostal do produkčního 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 kdekoli ve své aplikaci použít komponentu Translate k zobrazení přeloženého textu! Nezapomeňte se podívat do naší dokumentace pro více informací a implementační návody 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 sběru řetězců, čímž vám šetří cenný čas.
- Nákladově efektivní: Snižuje potřebu ručních překladů a tím i vaše náklady na lokalizaci.
- Lepší 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ž přidáte jakékoliv řetězce do komponenty Translate. Upozorňujeme, ž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řed jejím nasazením přidávat nové řetězce. To zabrání komukoli komukoli odcizit váš tajný API klíč a potenciálně nafouknout 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!