Cea mai bună soluție pentru internaționalizare (i18n) în aplicațiile React

Căutați să vă extindeți aplicația React către piețe noi? TacoTranslate face incredibil de ușor localizarea aplicațiilor React, permițându-vă să ajungeți la un public global fără bătăi de cap.

De ce să alegi TacoTranslate pentru React?

Integrare fără probleme: Proiectat special pentru aplicațiile React, TacoTranslate se integrează fără efort în fluxul tău de lucru existent.
Colectare automată a șirurilor: Nu mai trebuie să gestionezi manual fișiere JSON. TacoTranslate colectează automat șirurile din codul tău.
Traduceri alimentate de AI: Profită de puterea AI pentru a oferi traduceri contextuale și precise, care se potrivesc tonului aplicației tale.
Suport instantaneu pentru limbi: Adaugă suport pentru limbi noi cu doar un clic, făcând aplicația ta accesibilă la nivel global.

Cum funcționează

Instalează pachetul TacoTranslate prin npm:

npm install tacotranslate

Când ai instalat modulul, va trebui să creezi un cont TacoTranslate, un proiect de traducere și cheile API asociate. Creează un cont aici. Este gratuit și nu necesită să adaugi un card de credit.

În interfața aplicației TacoTranslate, creează un proiect și navighează la fila cheilor API. Creează o cheie read și o cheie read/write. Le vom salva ca variabile de mediu. Cheia read este ceea ce numim public iar cheia read/write este secret. De exemplu, le-ai putea adăuga într-un fișier .env aflat în rădăcina proiectului tău.

De asemenea, va trebui să adaugi încă două variabile de mediu: TACOTRANSLATE_DEFAULT_LOCALE și TACOTRANSLATE_ORIGIN.

TACOTRANSLATE_DEFAULT_LOCALE: Codul implicit pentru limba de rezervă. În acest exemplu, îl vom seta la en pentru engleză.
TACOTRANSLATE_ORIGIN: „Folderul” unde vor fi stocate șirurile tale, cum ar fi URL-ul site-ului tău. Citește mai multe despre origin aici.

.env

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

Asigurați-vă că nu divulgați niciodată cheia API secretă read/write în mediile de producție de pe partea clientului.

Configurarea TacoTranslate

Inițializați TacoTranslate în aplicația dumneavoastră React înfășurând aplicația în provider-ul contextului 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>
	);
}

Acum puteți folosi componenta Translate oriunde în aplicația dumneavoastră pentru a afișa text tradus! Asigurați-vă că consultați documentația noastră pentru mai multe informații și pentru ghiduri de implementare specifice configurației dumneavoastră.

import {Translate} from 'tacotranslate/react';

export default async function Component() {
	return (
		<Translate string="Hello? This is TacoTranslate speaking." />
	);
}

Beneficiile utilizării TacoTranslate

Economisire de timp: Automatizează procesul plictisitor de localizare și colectare a șirurilor de caractere, economisindu-ți timp prețios.
Cost-eficient: Reduce necesitatea traducerilor manuale, scăzând costurile de localizare.
Acuratețe îmbunătățită: Traduceări bazate pe AI asigură rezultate contextuale precise și de înaltă calitate.
Soluție scalabilă: Adaugă cu ușurință suport pentru limbi noi pe măsură ce aplicația și baza ta de utilizatori cresc.

Începeți astăzi!

Aplicația ta React va fi tradusă automat atunci când adaugi orice șiruri în componenta Translate. Reține că doar mediile cu permisiuni read/write asupra cheii API vor putea crea șiruri noi pentru traducere.

Recomandăm să ai un mediu de testare închis și securizat unde poți testa aplicația de producție, adăugând șiruri noi înainte de lansare. Aceasta va preveni ca oricine să îți fure cheia API secretă și, potențial, să umfle proiectul tău de traduceri prin adăugarea de șiruri neautorizate.

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!