Dokumentacija: Korištenje TacoTranslate

Korištenje TacoTranslate

Bosnian

Prevođenje stringova

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

Korištenje Translate komponente.
Prikazuje prijevode unutar span elementa i podržava prikaz 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 oznakama.

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 alata.
Prevedite 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 stringovi stignu na naše servere, prvo ih validiramo i sačuvamo, zatim odmah vraćamo strojni prevod. Iako su strojni prijevodi generalno nižeg kvaliteta u poređenju s našim AI prijevodima, oni pružaju brz početni odgovor.

Istovremeno, pokrećemo asinhroni prevodilački zadatak kako bismo generirali visokokvalitetan, najsavremeniji AI prevod za vaš string. Kada AI prevod bude spreman, zamijeniće strojni prevod i biće poslan svaki put kada zatražite prijedloge za vaše stringove.

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

Korištenje izvora

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

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 i drugi za vašu marketinšku stranicu.

Za detaljniju kontrolu, možete postaviti origins na nivou komponenti.

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

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

Na kraju, način na koji razdvajate stringove u origin-e zavisi od vas i vaših potreba. Međutim, imajte na umu da veliki broj stringova u jednom origin-u 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 pomoću dvostrukih uglastih zagrada, 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 prikaza HTML-a se toplo preporučuje prilikom prevođenja nepouzdanog sadržaja, poput sadržaja koji kreiraju korisnici.

Svi rezultati su uvijek očišćeni 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 nizovi

Korištenje izvora

Rukovanje varijablama

Upravljanje HTML sadržajem