Paras ratkaisu kansainvälistämiseen (i18n) React-sovelluksissa
Haluatko laajentaa React‑sovellustasi uusille markkinoille? TacoTranslate tekee React‑sovellusten lokalisoimisesta todella helppoa, jolloin voit tavoittaa maailmanlaajuisen yleisön ilman vaivaa.
Miksi valita TacoTranslate Reactille?
- Saumaton integrointi: Erityisesti React-sovelluksia varten suunniteltu TacoTranslate integroituu vaivattomasti olemassa olevaan työnkulkuusi.
- Automaattinen merkkijonojen kerääminen: Ei enää JSON-tiedostojen manuaalista hallintaa. TacoTranslate kerää merkkijonot automaattisesti koodipohjastasi.
- Tekoälyavusteiset käännökset: Hyödynnä tekoälyn voimaa tarjotaksesi kontekstuaalisesti tarkkoja käännöksiä, jotka sopivat sovelluksesi sävyyn.
- Välitön kielituki: Lisää tuki uusille kielille yhdellä napsautuksella ja tee sovelluksestasi maailmanlaajuisesti saatavaksi.
Miten se toimii
Asenna TacoTranslate-paketti npm:llä:
npm install tacotranslateKun moduuli on asennettu, sinun täytyy luoda TacoTranslate-tili, käännösprojekti ja siihen liittyvät API-avaimet. Luo tili tästä. Se on ilmainen, eikä vaadi luottokorttia.
TacoTranslate-sovelluksen käyttöliittymässä luo projekti ja siirry sen API-avaimet-välilehdelle. Luo yksi read -avain ja yksi read/write -avain. Tallennamme ne ympäristömuuttujiksi. read -avain on se, jota kutsumme public ja read/write -avain on secret. Esimerkiksi voit lisätä ne projektisi juureen sijaitsevaan .env -tiedostoon.
Sinun tulee myös lisätä kaksi muuta ympäristömuuttujaa: TACOTRANSLATE_DEFAULT_LOCALE ja TACOTRANSLATE_ORIGIN.
TACOTRANSLATE_DEFAULT_LOCALE: Oletusarvoinen varakielikoodi. Tässä esimerkissä asetamme sen arvoonen(englanti).TACOTRANSLATE_ORIGIN: ”Kansio”, johon merkkijonosi tallennetaan, esimerkiksi verkkosivustosi URL-osoite. Lue lisää originista täältä.
TACOTRANSLATE_PUBLIC_API_KEY=123456
TACOTRANSLATE_SECRET_API_KEY=789010
TACOTRANSLATE_DEFAULT_LOCALE=en
TACOTRANSLATE_ORIGIN=your-website-url.comVarmista, ettet koskaan vuoda salaista read/write API-avainta asiakaspuolen tuotantoympäristöihin.
TacoTranslaten käyttöönotto
Ota TacoTranslate käyttöön React-sovelluksessasi käärittämällä sovelluksesi TacoTranslate-kontekstin tarjoajan sisään:
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>
);
}Voit nyt käyttää Translate komponenttia missä tahansa sovelluksessasi näyttääksesi käännettyä tekstiä! Tutustu dokumentaatioomme saadaksesi lisätietoja ja ympäristöllesi räätälöityjä toteutusohjeita.
import {Translate} from 'tacotranslate/react';
export default async function Component() {
return (
<Translate string="Hello? This is TacoTranslate speaking." />
);
}TacoTranslaten käytön edut
- Ajan säästö: Automatisoi työlään lokalisoinnin ja merkkijonojen keräämisen, säästäen arvokasta aikaasi.
- Kustannustehokas: Vähentää manuaalisten käännösten tarvetta, mikä alentaa lokalisointikustannuksiasi.
- Parannettu tarkkuus: Tekoälyn tuottamat käännökset varmistavat kontekstinmukaisesti tarkat ja korkealaatuiset tulokset.
- Skaalautuva ratkaisu: Lisää helposti tuki uusille kielille, kun sovelluksesi ja asiakaskuntasi kasvavat.
Aloita tänään!
React-sovelluksesi käännetään automaattisesti, kun lisäät merkkijonoja Translate komponenttiin. Huomaa, että vain ympäristöt, joilla API-avaimella on read/write -käyttöoikeudet, pystyvät luomaan uusia käännettäviä merkkijonoja.
Suosittelemme suljettua ja suojattua staging-ympäristöä, jossa voit testata tuotantosovellustasi ja lisätä uusia merkkijonoja ennen julkaisua. Tämä estää ketään varastamasta salaista API-avaintasi ja mahdollisesti paisuttamasta käännösprojektiasi lisäämällä luvattomia merkkijonoja.
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!