Oversetting av strengar

Per no finst det tre måtar å omsetje strengar på: Translate komponenten, useTranslation hooken, eller translateEntries-verktøyet.

Bruke Translate‑komponenten.
Gir omsetjingar inne i eit span element, og støttar gjengiving av HTML.

import {Translate} from 'tacotranslate/react';

function Page() {
	return <Translate string="Hello, world!" />;
}

Du kan endre elementtypen ved til dømes å bruke as="p" på komponenten.

Bruke useTranslation hooken.
Returnerer omsetjingar som ein vanleg streng. Nyttig til dømes i meta taggar.

import {useEffect} from 'react';
import {useTranslation} from 'tacotranslate/react';

function Page() {
	const helloWorld = useTranslation('Hello, world!');

	useEffect(() => {
		alert(helloWorld);
	}, [helloWorld]);

	return (
		<title>{useTranslation('My page title')}</title>
	);
}

Bruk translateEntries verktøyet.
Oversett tekststrengar på serversida. Gje OpenGraph bileta eit ekstra løft.

import {createEntry, translateEntries} from 'tacotranslate';

async function generateMetadata(locale = 'es') {
	const title = createEntry({string: 'Hello, world!'});
	const description = createEntry({string: 'TacoTranslate on the server'});

	const translations = await translateEntries(
		tacoTranslate,
		{origin: 'opengraph', locale},
		[title, description]
	);

	return {
		title: translations(title),
		description: translations(description)
	};
}

Korleis strengar vert omsette

Når strengene når serverane våre, validerer og lagrar vi dei først, og returnerer med ein gong ei maskinomsetjing. Sjølv om maskinomsetjingar vanlegvis har lågare kvalitet enn AI-omsetjingane våre, gir dei eit raskt første svar.

Samstundes set vi i gang ei asynkron omsetjingsjobb for å generere ei høgkvalitets, toppmoderne AI-omsetjing for strengen din. Når AI-omsetjinga er klar, vil ho erstatte maskinomsetjinga og bli sendt kvar gong du ber om omsetjingar for strengane dine.

Om du har omsett ein streng manuelt, har dei omsette versjonane prioritet og vert returnerte i staden.

Bruke opphav

TacoTranslate-prosjekt inneheld det vi kallar origins. Sjå på dei som inngangspunkter, mappar eller grupper for strengane og omsetjingane dine.

Originar lar deg skilje strengar i meiningsfulle grupper. Til dømes kan du ha ein origin for dokumentasjon og ein annan for marknadsføringssida di.

For meir detaljert kontroll kan du opprette origins på komponentnivå.

For å oppnå dette, vurder å bruke fleire TacoTranslate tilbydarar i prosjektet ditt.

Merk at den same strengen kan få ulike omsetjingar i ulike originar.

Til slutt er det opp til deg og behova dine korleis du fordeler tekststrengane på origins. Merk likevel at å ha mange tekststrengar i ein origin kan auke lastetidene.

Handtering av variablar

Du bør alltid bruke variablar for dynamisk innhald, som brukarnamn, datoar, e-postadressar med meir.

Variablar i tekststrengar blir deklarerte ved å bruke doble krøllparentesar, som {{variable}}.

Handsaming av HTML-innhald

Som standard støttar komponenten Translate og rendrar HTML-innhald. Du kan derimot slå av denne åtferda ved å setje useDangerouslySetInnerHTML til false.

Det vert sterkt tilrådd å slå av HTML-gjengivelse når ein omset innhald som ikkje er til å stole på, til dømes brukargenerert innhald.

Alt innhald blir alltid rensa med sanitize-html før det blir vist.

import {Translate} from 'tacotranslate/react';

function Page() {
	return (
		<Translate
			string={`
				Welcome to <strong>my</strong> website.
				I’m using <a href="{{url}}">TacoTranslate</a> to translate text.
			`}
			variables={{url: 'https://tacotranslate.com'}}
			useDangerouslySetInnerHTML={false}
		/>
	);
}

Eksemplet ovenfor blir vist som rein tekst.