Zgjidhja më e mirë për ndërkombëtarizimin (i18n) në aplikacionet React

Si funksionon

Instaloni paketën TacoTranslate përmes npm:

npm install tacotranslate

Pasi të keni instaluar modulin, do t'ju duhet të krijoni një llogari TacoTranslate, një projekt përkthimi dhe çelësa API përkatës. Krijoni një llogari këtu. Është falas, dhe nuk kërkon që të shtoni një kartë krediti.

Brenda ndërfaqes së aplikacionit TacoTranslate, krijoni një projekt dhe shkoni te skeda e çelësave API. Krijoni një çelës read dhe një tjetër read/write. Do t'i ruajmë si variabla mjedisore. Çelësi read është ai që e quajmë public dhe çelësi read/write është secret. Për shembull, mund t'i shtoni në një skedar .env në rrënjën e projektit tuaj.

Gjithashtu do t'ju duhet të shtoni edhe dy variabla të mjedisit: TACOTRANSLATE_DEFAULT_LOCALE dhe TACOTRANSLATE_ORIGIN.

• TACOTRANSLATE_DEFAULT_LOCALE: Kodi i vendndodhjes së parazgjedhur (fallback). Në këtë shembull, do ta vendosim në en për gjuhën angleze.
• TACOTRANSLATE_ORIGIN: “dosja” ku do të ruhen tekstet tuaja, si p.sh. URL-ja e faqes tuaj të internetit. Lexoni më shumë rreth origjinave këtu.

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

Sigurohu që çelësi sekret read/write i API-së të mos rrjedhë kurrë në mjediset e prodhimit në anën e klientit.

Konfigurimi i TacoTranslate

Inicializoni TacoTranslate në aplikacionin tuaj React duke e mbështjellë atë me ofruesin e kontekstit 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>
	);
}

Tani mund ta përdorni komponentin Translate kudo në aplikacionin tuaj për të shfaqur tekst të përkthyer! Mos harroni të shikoni dokumentacionin tonë për më shumë informacion dhe për udhëzime të implementimit të përshtatura për konfigurimin tuaj.

import {Translate} from 'tacotranslate/react';

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

Përfitimet e përdorimit të TacoTranslate

• Kursim kohe: Automatizon procesin e monotontë të lokalizimit dhe mbledhjes së vargjeve të tekstit, duke ju kursyer kohë të vlefshme.
• Kosto-efektive: Redukton nevojën për përkthime manuale, duke ulur shpenzimet tuaja për lokalizim.
• Saktësi e përmirësuar: Përkthimet e fuqizuara me AI sigurojnë rezultate të sakta në kontekst dhe me cilësi të lartë.
• Zgjidhje e shkallëzuar: Shtoni lehtësisht mbështetje për gjuhë të reja ndërsa aplikacioni dhe baza juaj e klientëve rriten.

Filloni sot!

Aplikacioni juaj React do të përkthehet automatikisht kur të shtoni ndonjë varg në komponentin Translate. Kini parasysh që vetëm mjediset me lejet read/write në çelësin e API-së do të mund të krijojnë vargje të reja për t'u përkthyer.

Ne rekomandojmë të keni një mjedis testimi (staging) të mbyllur dhe të sigurt ku mund të provoni aplikacionin tuaj në prodhim, duke shtuar vargje të reja para se të publikoni. Kjo do të parandalojë që kushdo kushdo të vjedhë çelësin tuaj sekret të API-së, dhe potencialisht të mbingarkojë projektin tuaj të përkthimeve duke shtuar vargje të paautorizuara.

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!