Dokumentatsioon: TacoTranslate'i kasutamine

TacoTranslate kasutamine

Estonian

Stringide tõlkimine

Praegu on stringide tõlkimiseks kolm viisi: Translate komponent, useTranslation hook või translateEntries utiliit.

Kasutades Translate komponenti.
Kuvab tõlked span elemendi sees ja toetab HTML-i renderdamist.

import {Translate} from 'tacotranslate/react';

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

Elemendi tüüpi saab muuta, näiteks komponendil as="p".

useTranslation hooki kasutamine.
Tagastab tõlked lihttekstina. Kasulik näiteks meta siltides.

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>
	);
}

Kasutades translateEntries utiliiti.
Tõlgi stringid serveripoolselt. Tee oma OpenGraph pildid võimsamaks.

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)
	};
}

Kui stringid jõuavad meie serveritesse, valideerime ja salvestame need esmalt ning tagastame seejärel kohe masintõlke. Kuigi masintõlked on üldiselt meie AI-tõlgetest madalama kvaliteediga, annavad need kiire esialgse vastuse.

Samal ajal alustame asünkroonset tõlketööd, et teie stringi jaoks luua kõrgekvaliteediline tipptasemel tehisintellekti tõlge. Kui tehisintellekti tõlge on valmis, asendab see masintõlke ja saadetakse iga kord, kui pärite oma stringide tõlkeid.

Kui olete stringi käsitsi tõlkinud, siis eelistatakse neid tõlkeid ja need tagastatakse selle asemel.

Algallikate kasutamine

TacoTranslate projektid sisaldavad seda, mida me nimetame origins. Mõelge neile kui teie stringide ja tõlgete sisenemispunktidele, kaustadele või rühmadele.

import {TacoTranslate} from 'tacotranslate/react';

function Menu() {
	return (
		<TacoTranslate origin="application-menu">
			// ...
		</TacoTranslate>
	);
}

Origins võimaldavad teil jagada stringe tähenduslikesse konteineritesse. Näiteks võiks üks origin olla dokumentatsiooni jaoks ja teine teie turunduslehe jaoks.

Täpsema kontrolli jaoks võiksite seadistada originid komponendi tasandil.

Selle saavutamiseks kaalu oma projektis mitme TacoTranslate pakkuja kasutamist.

Pange tähele, et sama tekst võib erinevates päritoludes saada erinevaid tõlkeid.

Lõppkokkuvõttes on see teie otsustada, kuidas te stringe originsesse jaotate — see sõltub teie vajadustest. Siiski pidage meeles, et kui ühes originsis on palju stringe, võivad laadimisajad pikeneda.

Muutujate käsitlemine

Dünaamilise sisu puhul tuleks alati kasutada muutujaid, näiteks kasutajanimesid, kuupäevi, e‑posti aadresse ja muud.

Stringides olevad muutujad deklareeritakse kahe käharsulguga, näiteks {{variable}}.

import {Translate} from 'tacotranslate/react';

function Greeting() {
	const name = 'Juan';
	return <Translate string="Hello, {{name}}!" variables={{name}} />;
}

import {useTranslation} from 'tacotranslate/react';

function useGreeting() {
	const name = 'Juan';
	return useTranslation('Hello, {{name}}!', {variables: {name}});
}

HTML-sisu haldamine

Vaikimisi toetab ja renderdab Translate komponent HTML-sisu. Siiski saate sellest käitumisest loobuda, määrates useDangerouslySetInnerHTML väärtuseks false.

HTML-i renderdamise keelamine on tungivalt soovitatav, kui tõlgitakse usaldamatut sisu, näiteks kasutajate loodud sisu.

Kõik väljundid puhastatakse enne renderdamist alati sanitize-html.

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}
		/>
	);
}

Ülaltoodud näide kuvatakse tavalise tekstina.

Serveripoolne renderdamine

TacoTranslate kasutamine

Kuidas stringid tõlgitakse

Algallikate kasutamine

Muutujate käsitlemine

HTML-sisu haldamine