Problemfri lokalisering for React-applikationer

Hvordan det fungerer

Installer TacoTranslate-pakken via npm:

npm install tacotranslate

Når du har installeret modulet, skal du oprette en TacoTranslate-konto, et oversættelsesprojekt og tilhørende API-nøgler. Opret en konto her. Det er gratis, og kræver ikke, at du tilføjer et kreditkort.

Inden for TacoTranslate applikationens brugerflade, opret et projekt, og naviger til fanen for API-nøgler. Opret én read nøgle og én read/write nøgle. Vi gemmer dem som miljøvariable. read nøglen er det, vi kalder public og read/write nøglen er secret. For eksempel kan du tilføje dem til en .env fil i roden af dit projekt.

Du skal også tilføje to flere miljøvariabler: TACOTRANSLATE_DEFAULT_LOCALE og TACOTRANSLATE_ORIGIN.

• TACOTRANSLATE_DEFAULT_LOCALE: Standard fallback-sproglokalkode. I dette eksempel sætter vi den til en for engelsk.
• TACOTRANSLATE_ORIGIN: Den "mappe", hvor dine tekststrenge gemmes, f.eks. URL’en til din hjemmeside. Læs mere om origins her.

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

Sørg for aldrig at lække den hemmelige read/write API-nøgle til klient-side produktionsmiljøer.

Opsætning af TacoTranslate

Initialiser TacoTranslate i din React-applikation ved at indpakke din applikation i TacoTranslate context-udbyderen:

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 nu bruge Translate komponenten hvor som helst i din applikation for at vise oversat tekst! Sørg for at tjekke vores dokumentation for mere information og implementeringsvejledninger, der er specifikke for din opsætning.

import {Translate} from 'tacotranslate/react';

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

Fordele ved at bruge TacoTranslate

• Tidsbesparende: Automatiserer den kedelige proces med lokalisering og indsamling af strenge, hvilket sparer dig værdifuld tid.
• Omkostningseffektivt: Reducerer behovet for manuelle oversættelser og sænker dine omkostninger til lokalisering.
• Forbedret nøjagtighed: AI-drevne oversættelser sikrer kontekstuelt korrekte og kvalitetsrige resultater.
• Skalerbar løsning: Tilføj nemt støtte til nye sprog, efterhånden som din applikation og kundebase vokser.

Kom i gang i dag!

Din React-applikation vil blive oversat automatisk, når du tilføjer tekststrenge til en Translate komponent. Bemærk, at kun miljøer med read/write tilladelser på API-nøglen vil kunne oprette nye tekststrenge til oversættelse.

Vi anbefaler at have et lukket og sikret staging-miljø, hvor du kan teste din produktionsapplikation og tilføje nye tekststrenge, inden du går live. Dette vil forhindre, at nogen stjæler din hemmelige API-nøgle og potentielt oppuster dit oversættelsesprojekt ved at tilføje uvedkommende tekststrenge.

Sørg for at tjekke de fuldstændige eksempler på vores GitHub-profil. Hvis du støder på problemer, er du velkommen til at kontakte os, og vi hjælper dig mere end gerne.

TacoTranslate gør det muligt for dig automatisk at lokalisere dine React-applikationer hurtigt til og fra alle sprog. Oversæt gratis!