Den beste løysinga for internasjonalisering (i18n) i React-applikasjonar

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

Kvifor velje TacoTranslate for React?

Sømlaus integrasjon: Utvikla særskilt for React-applikasjonar, integrerer TacoTranslate seg utan problem i den eksisterande arbeidsflyten din.
Automatisk samling av strengar: Ikkje lenger behov for å handtere JSON-filer manuelt. TacoTranslate samlar automatisk strengar frå kodebasen din.
AI-drevne omsetjingar: Utnytt krafta til AI for å gi kontekstuelt nøyaktige omsetjingar som passar tonen i applikasjonen din.
Augeblikkleg språkstøtte: Legg til støtte for nye språk med berre eitt 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 krev ikkje at du legg inn eit kredittkort.

I brukargrensesnittet til TacoTranslate 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 den read/write nøkkelen er secret. Til dømes kan du leggje dei til i ei .env fil i rotmappa av prosjektet ditt.

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

TACOTRANSLATE_DEFAULT_LOCALE: Standard fallback-lokalkode. I dette dømet set vi den til en for engelsk.
TACOTRANSLATE_ORIGIN: “mappa” der tekststrengane dine vert lagra, til dømes URL-en til nettstaden 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 ikkje lekker den hemmelege read/write API-nøkkelen til klient-side produksjonsmiljø.

Setje opp TacoTranslate

Initialiser TacoTranslate i React-applikasjonen din ved å pakke applikasjonen 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 å sjekke ut dokumentasjonen vår for meir informasjon og implementasjonsrettleiingar tilpassa oppsetet 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 tekststrengar, og sparar deg verdifull tid.
Kostnadseffektivt: Reduserer behovet for manuelle omsetjingar og senkar kostnadene ved lokaliseringsarbeidet ditt.
Forbetra nøyaktigheit: AI-drevne omsetjingar sikrar kontekstuelt presise og høgkvalitetsresultat.
Skalerbar løysing: Legg enkelt til støtte for nye språk etter kvart som applikasjonen og kundebasen din veks.

Kom i gang i dag!

React-applikasjonen din blir automatisk omsett når du legg til tekstar i ein Translate komponent. Merk at berre miljø med read/write rettar på API-nøkkelen vil kunne opprette nye tekstar som skal omsetjast.

Vi anbefaler å ha eit lukka og sikra staging-miljø der du kan teste produksjonsapplikasjonen din, og legge til nye tekstar før du går live. Dette vil hindre nokon nokon i å stjele den hemmelege API-nøkkelen din, og potensielt blåse opp omsetjingsprosjektet ditt ved å legge til uønska tekstar.

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!