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

Leter du etter å utvide React-applikasjonen din til nye marknader? TacoTranslate gjer det utruleg enkelt å lokaliserer React-apps, slik at du kan nå eit globalt publikum utan maset.

Kvifor velje TacoTranslate for React?

Sømlaus integrasjon: Spesielt utvikla for React-applikasjonar, integrerer TacoTranslate problemfritt i den eksisterande arbeidsflyten din.
Automatisk strengsamling: Ikkje lenger behov for å handtere JSON-filer manuelt. TacoTranslate samlar automatisk strengar frå kodebasen din.
AI-drevne omsettingar: Nyt godt av krafta til AI for å gi kontekstnøyaktige omsettingar 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-pakka 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 kredittkort.

Inne i TacoTranslate-applikasjonen sin brukargrensesnitt, opprett eit prosjekt, og naviger til fana for API-nøkler. Opprett ein read nøkkel, og ein read/write nøkkel. Vi vil lagre dei som miljøvariablar. read nøkkelen er det vi kallar public, og read/write nøkkelen er secret. For eksempel kan du legge dei til i ein .env fil i roten av prosjektet ditt.

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

TACOTRANSLATE_DEFAULT_LOCALE: Standard fallback-språkkode. I dette eksempelet set vi den til en for engelsk.
TACOTRANSLATE_ORIGIN: «Mappa» der strengane dine vil bli lagra, til dømes nettadressa 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å å aldri lekke den hemmelige read/write API-nøkkelen til klient-side produksjonsmiljø.

Setje opp TacoTranslate

Initialiser TacoTranslate i React-applikasjonen din ved å pakke applikasjonen inn i TacoTranslate context provider:

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 omsette tekst! Ver sikker på å sjå vår dokumentasjon for meir informasjon, og for implementeringsveiledningar som er spesifikke for oppsettet ditt.

import {Translate} from 'tacotranslate/react';

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

Fordelar med å bruke TacoTranslate

Tidsbesparande: Automatiserer den tidkrevjande prosessen med lokaliseringsarbeid og innsamling av strengar, og sparer deg verdifull tid.
Kostnadseffektivt: Reduserer behovet for manuelle omsettingar, og senkar lokaliseringskostnadene dine.
Forbetra nøyaktigheit: AI-drevne omsettingar sikrar kontekstnøyaktige og høgkvalitative resultat.
Skalerbar løysing: Legg enkelt til støtte for nye språk etter kvart som applikasjonen og kundebasen veks.

Kom i gang i dag!

Din React-applikasjon vil bli automatisk oversatt når du legger til tekststrenger i ein Translate komponent. Merk at berre miljø med read/write rettigheiter på API-nøkkelen vil kunne opprette nye strengjer som skal omsetjast.

Vi tilrår å ha eit lukka og sikra staging-miljø der du kan teste produksjonsapplikasjonen din, og legge til nye strengjer før du går live. Dette vil hindre at nokon stjeler den hemmelige API-nøkkelen din, og potensielt fyller opp omsetjingsprosjektet ditt med uønska strengjer.

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!