Najlepšie riešenie pre internacionalizáciu (i18n) v React aplikáciách
Hľadáte spôsob, ako rozšíriť svoju React aplikáciu na nové trhy? TacoTranslate vám to neuveriteľne uľahčí lokalizáciu vašich React aplikácií, čo vám umožní osloviť globálne publikum bez zbytočných komplikácií.
Prečo si vybrať TacoTranslate pre React?
- Bezproblémová integrácia: Navrhnuté špeciálne pre React aplikácie, TacoTranslate sa ľahko integruje do vášho existujúceho pracovného postupu.
- Automatický zber reťazcov: Už žiadne manuálne spravovanie JSON súborov. TacoTranslate automaticky zbiera reťazce z vášho kódu.
- Preklady poháňané AI: Využite silu AI na poskytovanie kontextovo presných prekladov, ktoré ladia s tónom vašej aplikácie.
- Okamžitá podpora jazykov: Pridajte podporu pre nové jazyky jedným kliknutím, čím sprístupníte vašu aplikáciu globálne.
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. Vytvorte si účet tu. 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ľúče. 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.
Tiež bude potrebné pridať ďalšie dve premenné prostredia: TACOTRANSLATE_DEFAULT_LOCALE
a TACOTRANSLATE_ORIGIN
.
TACOTRANSLATE_DEFAULT_LOCALE
: Predvolený náhradný kód locale. V tomto príklade ho nastavíme naen
pre angličtinu.TACOTRANSLATE_ORIGIN
: „Zložka“, kde budú vaše reťazce uložené, napríklad URL adresa vašej webovej stránky. Viac o origins si prečítajte tu.
TACOTRANSLATE_PUBLIC_API_KEY=123456
TACOTRANSLATE_SECRET_API_KEY=789010
TACOTRANSLATE_DEFAULT_LOCALE=en
TACOTRANSLATE_ORIGIN=your-website-url.com
Uistite sa, že nikdy nevyzradíte tajný read/write
API kľúč v produkčných prostrediach na strane klienta.
Nastavenie TacoTranslate
Inicializujte TacoTranslate vo vašej aplikácii React tak, že obalíte svoju aplikáciu v poskytovateľovi 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 zobrazenie preloženého textu! Nezabudnite si pozrieť našu dokumentáciu pre viac informácií a návody na implementáciu špecifické pre vaše nastavenie.
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 vám šetrí cenný čas.
- Úsporné riešenie: Znižuje potrebu manuálnych prekladov, čím znižuje vaše náklady na lokalizáciu.
- Zlepšená presnosť: Preklady poháňané AI zabezpečujú kontextovo presné a kvalitné výsledky.
- Škálovateľné riešenie: Jednoducho pridávajte podporu nových jazykov podľa rastu vašej aplikácie a zákazníckej základne.
Začnite ešte dnes!
Vaša React aplikácia bude automaticky preložená, keď pridáte akékoľvek reťazce do komponentu Translate
. Upozorňujeme, že len prostredia s oprávneniami read/write
na API kľúči budú schopné vytvárať nové reťazce na preklad.
Odporúčame mať uzavreté a zabezpečené testovacie prostredie, kde môžete otestovať vašu produkčnú aplikáciu a pred spustením pridávať nové reťazce. Tým zabránite komukoľvek ukradnúť váš tajný API kľúč a potenciálne nafúknuť váš prekladateľský projekt pridaním nežiadaných reťazcov.
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!