Dokumentacija: Korišćenje TacoTranslate

Korišćenje TacoTranslate

Serbian

Prevođenje nizova

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

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

import {Translate} from 'tacotranslate/react';

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

Možete promeniti tip elementa 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. Ojač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)
	};
}

Када низови стигну на наше сервере, прво их верификујемо и чувамо, а затим одмах шаљемо машински превод. Иако су машински преводи обично нижег квалитета у поређењу са нашим AI преводима, они пружају брз почетни одговор.

Istovremeno započinjemo asinhroni zadatak prevođenja kako bismo generisali visokokvalitetan, najsavremeniji AI prevod za vaš string. Kada AI prevod bude 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 string, ti prevodi imaju prioritet i umesto toga se vraćaju.

Korišćenje izvora

TacoTranslate projekti 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 smislenije 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 string može da dobije različite prevode u različitim izvorima.

Na kraju krajeva, način na koji delite stringove u origin-je zavisi od vas i vaših potreba. Ipak, imajte na umu da veliki broj stringova unutar jednog origin-a može povećati vreme učitavanja.

Rukovanje promenljivim

Uvek treba koristiti promenljive za dinamički sadržaj, kao što su korisnička imena, datumi, e-mail adrese i još mnogo toga.

Promenljive u nizovima se deklarišu koristeći dvostruke uglaste 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 tako što ćete postaviti useDangerouslySetInnerHTML na false.

Isključivanje prikaza HTML-a se snažno preporučuje 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 prikazivanja.

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 će biti prikazan kao običan tekst.

Rendering na serverskoj strani

Korišćenje TacoTranslate

Kako se stringovi prevode

Korišćenje izvora

Rukovanje promenljivim

Upravljanje HTML sadržajem