Effortsfri lokalisering for React-applikationer

Sådan fungerer det

Installer TacoTranslate-pakken via npm:

npm install tacotranslate

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

Inde i TacoTranslate applikationens brugerflade skal du oprette et projekt og navigere til fanen for API-nøgler. Opret én read nøgle og én read/write nøgle. Vi gemmer dem som miljøvariabler. read nøglen kalder vi 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øvariable: TACOTRANSLATE_DEFAULT_LOCALE og TACOTRANSLATE_ORIGIN.

• TACOTRANSLATE_DEFAULT_LOCALE: Standard fallback-sprogkode. I dette eksempel sætter vi den til en for engelsk.
• TACOTRANSLATE_ORIGIN: Den “mappe”, hvor dine strenge vil blive gemt, for eksempel URL’en til dit website. 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 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 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 for implementeringsvejledninger, der er specifikke for dit setup.

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.
• Omkostningseffektiv: Reducerer behovet for manuelle oversættelser, hvilket sænker dine lokaliseringsomkostninger.
• Forbedret nøjagtighed: AI-drevne oversættelser sikrer kontekstuelt korrekte og højtkvalitative resultater.
• Skalerbar løsning: Tilføj nemt support for 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 uønskede tekststrenge.

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

TacoTranslate giver dig mulighed for automatisk at lokalisere dine React-applikationer hurtigt til og fra alle sprog. Oversæt gratis!