Najbolje rješenje za internacionalizaciju (i18n) u React aplikacijama
Želite li proširiti svoju React aplikaciju na nova tržišta? TacoTranslate izuzetno olakšava lokalizaciju vaših React aplikacija, omogućujući vam da bez poteškoća dosegnete globalnu publiku.
Zašto odabrati TacoTranslate za React?
- Besprijekorna integracija: Dizajniran posebno za React aplikacije, TacoTranslate se bez napora integrira u vaš postojeći tijek rada.
- Automatsko prikupljanje tekstova: Nema više ručnog upravljanja JSON datotekama. TacoTranslate automatski prikuplja tekstove iz vašeg koda.
- Prijevodi pokretani umjetnom inteligencijom: Iskoristite snagu umjetne inteligencije za kontekstualno točne prijevode koji odgovaraju tonu vaše aplikacije.
- Trenutačna podrška za jezike: Dodajte podršku za nove jezike jednim klikom, čineći vašu aplikaciju globalno dostupnom.
Kako to radi
Instalirajte paket TacoTranslate putem npm-a:
npm install tacotranslate
Kada instalirate modul, trebat ćete stvoriti TacoTranslate račun, projekt za prijevod i pripadajuće API ključeve. Kreirajte račun ovdje. Besplatno je i ne zahtijeva dodavanje podataka o kreditnoj kartici.
Unutar korisničkog sučelja aplikacije TacoTranslate stvorite projekt i otvorite karticu API ključevi. Stvorite jedan read
ključ i jedan read/write
ključ. Spremit ćemo ih kao varijable okruženja. Ključ read
nazivamo public
, a ključ read/write
nazivamo secret
. Na primjer, možete ih dodati u .env
datoteku u korijenu vašeg projekta.
Također trebate dodati još dvije varijable okruženja: TACOTRANSLATE_DEFAULT_LOCALE
i TACOTRANSLATE_ORIGIN
.
TACOTRANSLATE_DEFAULT_LOCALE
: Zadani kod rezervnog lokaliteta. U ovom primjeru postavit ćemo ga naen
za engleski.TACOTRANSLATE_ORIGIN
: „mapa” u kojoj će se pohranjivati vaši stringovi, poput URL-a vaše web-stranice. Pročitajte više o originima ovdje.
TACOTRANSLATE_PUBLIC_API_KEY=123456
TACOTRANSLATE_SECRET_API_KEY=789010
TACOTRANSLATE_DEFAULT_LOCALE=en
TACOTRANSLATE_ORIGIN=your-website-url.com
Pazite da tajni read/write
API ključ nikada ne procure u produkcijska okruženja na strani klijenta.
Postavljanje TacoTranslatea
Inicijalizirajte TacoTranslate u svojoj React aplikaciji tako da aplikaciju obuhvatite TacoTranslate pružateljem konteksta:
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>
);
}
Sada možete koristiti komponentu Translate
bilo gdje unutar vaše aplikacije za prikaz prevedenog teksta! Obavezno pogledajte našu dokumentaciju za više informacija i vodiče za implementaciju specifične za vašu konfiguraciju.
import {Translate} from 'tacotranslate/react';
export default async function Component() {
return (
<Translate string="Hello? This is TacoTranslate speaking." />
);
}
Prednosti korištenja TacoTranslate
- Ušteda vremena: Automatizira zamoran proces lokalizacije i prikupljanja stringova, štedeći vam dragocjeno vrijeme.
- Isplativo: Smanjuje potrebu za ručnim prijevodima, čime se smanjuju troškovi lokalizacije.
- Poboljšana točnost: Prijevodi potpomognuti umjetnom inteligencijom osiguravaju kontekstualno točne i visokokvalitetne rezultate.
- Skalabilno rješenje: Jednostavno dodajte podršku za nove jezike kako vaša aplikacija i baza korisnika rastu.
Započnite danas!
Vaša React aplikacija bit će automatski prevedena kada u Translate
komponentu dodate bilo koje stringove. Imajte na umu da samo ona okruženja koja za API ključ imaju dozvole read/write
mogu stvarati nove stringove za prevođenje.
Preporučujemo da imate zatvoreno i sigurno staging okruženje u kojem možete testirati produkcijsku aplikaciju i dodavati nove stringove prije puštanja u rad. To će spriječiti bilo koga da ukrade vaš tajni API ključ i time potencijalno napuhati vaš projekt prijevoda dodavanjem neovlaštenih stringova.
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!