Dokumentacija: Korišćenje TacoTranslate

Korišćenje TacoTranslate

Serbian

Prevođenje tekstova

Trenutno postoje tri načina za prevođenje stringova: komponenta Translate, hook useTranslation, ili pomoćna funkcija translateEntries.

Korišćenje Translate komponente.
Prikazuje prevode unutar elementa span, i podržava prikazivanje HTML-a.

import {Translate} from 'tacotranslate/react';

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

Tip elementa možete promeniti, na primer, pomoću as="p" na komponenti.

Korišćenje useTranslation hook-a.
Vraća prevode kao običan string. Korisno, na primer, u meta tagovima.

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

Korišćenje utiliteta translateEntries.
Prevodite stringove na serverskoj strani. Unapredite svoje OpenGraph slike.

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

Kada stringovi stignu na naše servere, prvo ih validiramo i sačuvamo, a zatim odmah vraćamo mašinski prevod. Iako su mašinski prevodi generalno nižeg kvaliteta u poređenju sa našim AI prevodima, oni pružaju brz početni odgovor.

Istovremeno pokrećemo asinhroni prevodilački zadatak da bismo generisali visokokvalitetan, najsavremeniji AI prevod za vaš string. Kada AI prevod bude spreman, on će zameniti mašinski prevod i biće poslat svaki put kada zatražite prevode za vaše stringove.

Ako ste ručno preveli string, ti prevodi imaju prednost i biće vraćeni umesto toga.

Korišćenje originova

TacoTranslate projekti sadrže ono što nazivamo origins. Zamislite ih kao ulazne tačke, foldere ili grupe za vaše stringove i njihove prevode.

import {TacoTranslate} from 'tacotranslate/react';

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

Origins vam omogućavaju da razdvojite stringove u smislenije kontejnere. Na primer, možete imati jedan origin za dokumentaciju i drugi za vašu marketinšku stranicu.

Za detaljniju kontrolu, možete podesiti origins na nivou komponente.

Da biste to postigli, razmislite o korišćenju više TacoTranslate provajdera u vašem projektu.

Imajte na umu da isti tekst može imati različite prevode u različitim originima.

Na kraju, način na koji razdvajate stringove po originima zavisi od vas i vaših potreba. Međutim, imajte na umu da veliki broj stringova u jednom originu može povećati vreme učitavanja.

Rukovanje promenljivima

Uvek treba koristiti promenljive za dinamički sadržaj, kao što su imena korisnika, datumi, adrese e-pošte i slično.

Promenljive u stringovima se deklarišu pomoću dvostrukih zagrada, na primer {{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}});
}

Upravljanje HTML sadržajem

Podrazumevano, komponenta Translate podržava i renderuje HTML sadržaj. Međutim, možete isključiti ovo ponašanje postavljanjem useDangerouslySetInnerHTML na false.

Toplo se preporučuje onemogućavanje prikaza HTML-a prilikom prevođenja nepouzdanog sadržaja, kao što je sadržaj koji kreiraju korisnici.

Sav izlaz se uvek sanitizuje pomoću sanitize-html pre nego što bude prikazan.

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

Gornji primer biće prikazan kao običan tekst.

Renderovanje na serverskoj strani

Korišćenje TacoTranslate

Kako se prevode stringovi

Korišćenje originova

Rukovanje promenljivima

Upravljanje HTML sadržajem