Dokumentasyon: Paggamit ng TacoTranslate

Paggamit ng TacoTranslate

Filipino (Tagalog)

Pagsasalin ng mga string

Sa ngayon, may tatlong paraan para isalin ang mga string: ang Translate component, ang useTranslation hook, o ang translateEntries utility.

Paggamit ng Translate na component.
Naglalabas ng mga salin sa loob ng span elemento, at sumusuporta sa pag-render ng HTML.

import {Translate} from 'tacotranslate/react';

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

Maaari mong baguhin ang uri ng elemento gamit, halimbawa, as="p" sa komponent.

Paggamit ng hook na useTranslation.
Nagbabalik ng mga pagsasalin bilang simpleng string. Kapaki-pakinabang, halimbawa, sa mga tag na meta.

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

Paggamit ng kagamitang translateEntries.
Isalin ang mga string sa panig ng server. Pahusayin nang malaki ang iyong OpenGraph na mga imahe.

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

Paano isinasalin ang mga string

Kapag naabot ng mga string ang aming mga server, unang sinusuri at ini-save namin ang mga ito, at agad na ibinabalik ang isang pagsasaling makina. Bagaman karaniwang mas mababa ang kalidad ng mga pagsasaling makina kumpara sa aming mga AI na pagsasalin, nagbibigay ang mga ito ng mabilis na paunang tugon.

Kasabay nito, nagsisimula kami ng isang asinkronong trabaho sa pagsasalin upang makabuo ng mataas na kalidad, makabagong pagsasaling AI para sa iyong string. Kapag handa na ang pagsasaling AI, papalitan nito ang pagsasalin ng makina at ipapadala tuwing hihilingin mo ang mga pagsasalin para sa iyong mga string.

Kung manu-manong isinalin mo ang isang string, mauuna ang mga pagsasaling iyon at sila ang ibabalik.

Paggamit ng mga pinagmulan

Ang mga proyekto ng TacoTranslate ay naglalaman ng tinatawag naming pinagmulan. Isipin ang mga ito bilang mga entry point, folder, o grupo para sa iyong mga string at pagsasalin.

import {TacoTranslate} from 'tacotranslate/react';

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

Pinapayagan ka ng mga origin na paghiwalayin ang mga string sa mga makabuluhang lalagyan. Halimbawa, maaari kang magkaroon ng isang origin para sa dokumentasyon at isa pa para sa iyong pahina ng marketing.

Para sa mas detalyadong kontrol, maaari mong itakda ang origins sa antas ng component.

Upang makamit ito, isaalang-alang ang paggamit ng maramihang TacoTranslate provider sa iyong proyekto.

Pakitandaan na ang parehong string ay maaaring magkaroon ng magkakaibang pagsasalin sa iba't ibang pinagmulan.

Sa huli, kung paano mo hahatiin ang mga string sa mga pinagmulan ay nakasalalay sa iyo at sa iyong mga pangangailangan. Gayunpaman, tandaan na ang pagkakaroon ng maraming string sa loob ng isang pinagmulan ay maaaring magpataas ng oras ng paglo-load.

Paghawak ng mga variable

Dapat mong laging gamitin ang mga variable para sa dynamic na nilalaman, tulad ng mga pangalan ng gumagamit, mga petsa, mga e-mail address, at iba pa.

Ang mga variable sa mga string ay idinedeklara gamit ang dobleng panaklong, gaya ng {{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}});
}

Pamamahala ng nilalaman ng HTML

Bilang default, sinusuportahan at nire-render ng Translate na component ang nilalamang HTML. Gayunpaman, maaari mong piliing huwag paganahin ang pag-uugaling ito sa pamamagitan ng pagtatakda ng useDangerouslySetInnerHTML sa false.

Lubos na inirerekomenda na huwag paganahin ang pag-render ng HTML kapag isinasalin ang hindi mapagkakatiwalaang nilalaman, gaya ng nilalamang nilikha ng mga gumagamit.

Lahat ng output ay palaging sinasanitize gamit ang sanitize-html bago ito i-render.

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

Ang halimbawa sa itaas ay ipapakita bilang payak na teksto.

Pag-render sa server