TacoTranslate
/
DokumentasjonPrisar
 
Artikkel
04. mai

Enkel lokalisering for React-applikasjonar

Ønskjer du å utvide React-applikasjonen din til nye marknader? TacoTranslate gjer det utruleg enkelt å lokalisere React-appar, slik at du kan nå eit globalt publikum utan bryet.

Kvifor velje TacoTranslate for React?

  • Sømlaus integrasjon: Utforma spesielt for React-applikasjonar, integrerer TacoTranslate seg sømlaus i den eksisterande arbeidsflyten din.
  • Automatisk innsamling av strengar: Ikkje lenger treng du å handsame JSON-filer manuelt. TacoTranslate samlar automatisk strengar frå kodebasen din.
  • AI-drevne omsetjingar: Dra nytte av krafta i AI for å gi kontekstnøyaktige omsetjingar som passar tonen i applikasjonen din.
  • Umiddelbar språkstøtte: Legg til støtte for nye språk med berre eit klikk, og gjer applikasjonen din globalt tilgjengeleg.

Korleis det fungerer

Installer TacoTranslate-pakken via npm:

npm install tacotranslate

Når du har installert modulen, må du opprette ein TacoTranslate-konto, eit omsetjingsprosjekt og tilhøyrande API-nøklar. Opprett ein konto her. Det er gratis, og du treng ikkje oppgi eit kredittkort.

I TacoTranslate-applikasjonen sitt brukargrensesnitt, opprett eit prosjekt og gå til fanen for API-nøklar. Opprett ein read nøkkel og ein read/write nøkkel. Vi lagrar dei som miljøvariablar. Den read nøkkelen er det vi kallar public og read/write nøkkelen er secret. Til dømes kan du leggje dei til i ein .env fil i roten av prosjektet ditt.

Du må òg leggje til to fleire miljøvariablar: TACOTRANSLATE_DEFAULT_LOCALE og TACOTRANSLATE_ORIGIN.

  • TACOTRANSLATE_DEFAULT_LOCALE: Standard lokalkode som blir brukt som reserve. I dette dømet brukar vi en for engelsk.
  • TACOTRANSLATE_ORIGIN: Mappa der tekstane dine blir lagra, til dømes URL-en til nettsida di. Les meir om originar her.
.env
TACOTRANSLATE_PUBLIC_API_KEY=123456
TACOTRANSLATE_SECRET_API_KEY=789010
TACOTRANSLATE_DEFAULT_LOCALE=en
TACOTRANSLATE_ORIGIN=your-website-url.com

Pass på at du aldri lekkjer den hemmelege read/write API-nøkkelen i produksjonsmiljø på klientsida.

Setje opp TacoTranslate

Initialiser TacoTranslate i React-applikasjonen din ved å pakke den inn i TacoTranslate-kontekstleverandøren:

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>
	);
}

Du kan no bruke Translate komponenten kvar som helst i applikasjonen din for å vise omsett tekst! Hugs å sjå i dokumentasjonen vår for meir informasjon og for implementasjonsrettleiingar tilpassa oppsettet ditt.

import {Translate} from 'tacotranslate/react';

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

Fordelar ved å bruke TacoTranslate

  • Tidsbesparande: Automatiserer den tidkrevjande prosessen med lokalisering og innsamling av strengar, og sparar deg verdifull tid.
  • Kostnadseffektiv: Reduserer behovet for manuell omsetjing og senkar kostnadene ved lokalisering.
  • Forbetra nøyaktigheit: AI-drevne omsetjingar sikrar kontekstuelt nøyaktige og høgkvalitetsresultat.
  • Skalerbar løysing: Legg enkelt til støtte for nye språk etter kvart som applikasjonen og kundebasen veks.

Kom i gang i dag!

React-applikasjonen din vil bli automatisk omsett når du legg til nokre strengar i ein Translate komponent. Merk at berre miljø med read/write tillatelsar for API-nøkkelen vil kunne opprette nye strengar som skal omsetjast.

Vi anbefaler å ha eit lukka og sikra staging-miljø der du kan teste produksjonsapplikasjonen din og leggje til nye strengar før du går live. Dette vil hindre nokon nokon i å stele den hemmelege API-nøkkelen din, og potensielt oppblåse omsetjingsprosjektet ditt ved å leggje til uautoriserte strengar.

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!

Eit produkt frå NattskiftetLaga i Noreg