Dokumentacija: Korištenje TacoTranslate

Korištenje TacoTranslate

Bosnian

Prevođenje nizova

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

Korištenje Translate komponente.
Izlaz prevoda unutar span elementa, i podržava prikazivanje HTML-a.

import {Translate} from 'tacotranslate/react';

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

Možete promijeniti tip elementa koristeći, na primjer, as="p" na komponenti.

Korištenje useTranslation hook-a.
Vraća prijevode kao običan tekst. Korisno, na primjer, 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štenje translateEntries utility-a.
Prevodi stringove na serverskoj strani. Poboljš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 nizovi stignu na naše servere, prvo ih validiramo i sačuvamo, zatim odmah vraćamo mašinski prevod. Iako su mašinski prevodi obično nižeg kvaliteta u poređenju sa našim AI prevodima, oni pružaju brz početni odgovor.

Istovremeno, pokrećemo asinhroni zadatak prevođenja kako bismo generirali visokokvalitetan, najsavremeniji AI prijevod za vašu frazu. Kada AI prijevod bude spreman, zamijenit će mašinski prijevod i biće poslan svaki put kada zatražite prijevode za vaše fraze.

Ako ste ručno preveli neki niz, ti prijevodi imaju prednost i umjesto toga se vraćaju.

Korištenje izvora

Projekti TacoTranslate sadrže ono što nazivamo izvori. Možete ih zamisliti kao ulazne tačke, foldere ili grupe za vaše nizove 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 primjer, možete imati jedan origin za dokumentaciju, a drugi za vašu marketinšku stranicu.

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

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

Imajte na umu da ista fraza može dobiti različite prevode u različitim izvorima.

Na kraju, način na koji razdvajate stringove u izvore zavisi od vas i vaših potreba. Međutim, imajte na umu da veliki broj stringova unutar jednog izvora može povećati vrijeme učitavanja.

Rukovanje varijablama

Uvijek biste trebali koristiti varijable za dinamički sadržaj, poput korisničkih imena, datuma, e-mail adresa i slično.

Varijable u nizovima se deklariraju koristeći dvostruke zagrade, kao {{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 postavljanjem useDangerouslySetInnerHTML na false.

Isključivanje HTML prikaza je toplo preporučeno prilikom prevođenja nepouzdanog sadržaja, poput sadržaja koji generišu korisnici.

Sav izlaz se uvijek sanitizira pomoću sanitize-html prije prikaza.

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

Renderovanje na strani servera

Korištenje TacoTranslate

Kako se prevode stringovi

Korištenje izvora

Rukovanje varijablama

Upravljanje HTML sadržajem