Dokumentacija: Korišćenje TacoTranslate

Korišćenje TacoTranslate

Serbian

Prevođenje stringova

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

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

import {Translate} from 'tacotranslate/react';

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

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

Korišćenje useTranslation hook-a.
Vraća prevode kao običan tekst. 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 translateEntries pomoćnog alata.
Prevodi stringove na serverskoj strani. Pojačajte 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, 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 kako bismo generisali visokokvalitetan, najsavremeniji AI prevod za vaš string. Kada je AI prevod spreman, zameniće mašinski prevod i biće poslat svaki put kada zatražite prevode za vaše stringove.

Ako ste ručno preveli neki niz znakova, ti prevodi imaju prednost i umesto toga se vraćaju.

Korišćenje izvora

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

import {TacoTranslate} from 'tacotranslate/react';

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

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

Za detaljniju kontrolu, možete podesiti origin-e na nivou komponenti.

Da biste to postigli, razmotrite korišćenje više TacoTranslate provajdera unutar vašeg projekta.

Imajte na umu da ista fraza može imati različite prevode u različitim origin-ima.

Na kraju krajeva, kako ćete razvrstati stringove u origin-e zavisi od vas i vaših potreba. Međutim, imajte na umu da prisustvo mnogo stringova unutar jednog origin-a može povećati vreme učitavanja.

Rukovanje varijablama

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

Promenljive u nizovima se deklariraju koristeći dvostruke zagrade, kao što je {{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

Po defaultu, Translate komponenta podržava i prikazuje HTML sadržaj. Međutim, možete isključiti ovo ponašanje podešavanjem vrednosti useDangerouslySetInnerHTML na false.

Isključivanje prikaza HTML-a je snažno preporučeno prilikom prevođenja nepouzdanog sadržaja, kao što je sadržaj koji generišu korisnici.

Sav izlaz je uvek očišćen pomoću sanitize-html pre nego što se prikaže.

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

Gore navedeni primer biće prikazan kao običan tekst.

Rendering na serverskoj strani

Korišćenje TacoTranslate

Kako se stringovi prevode

Korišćenje izvora

Rukovanje varijablama

Upravljanje HTML sadržajem