दस्तऐवज: TacoTranslate वापरणे

TacoTranslate वापरणे

Marathi

स्ट्रिंग्जचे भाषांतर

सध्या स्ट्रिंग्जचे अनुवाद करण्याचे तीन मार्ग आहेत: Translate घटक, useTranslation हुक, किंवा translateEntries युटिलिटी.

Translate घटक वापरणे.
अनुवाद span घटकाच्या आत प्रदर्शित करतो आणि HTML रेंडरिंगचे समर्थन करतो.

import {Translate} from 'tacotranslate/react';

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

उदाहरणार्थ, घटकावर as="p" वापरून तुम्ही एलिमेंटचा प्रकार बदलू शकता.

useTranslation हुकचा वापर.
अनुवाद साध्या मजकूराच्या स्वरूपात परत करतो. उदाहरणार्थ, 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>
	);
}

translateEntries युटिलिटी वापरणे.
सर्व्हर साइडवर स्ट्रिंग्ज अनुवादित करा. तुमच्या OpenGraph प्रतिमांना अधिक सामर्थ्य द्या.

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 अनुवादांच्या तुलनेत दर्जात कमी असतात, तरीही ते एक जलद प्रारंभिक प्रतिसाद देतात.

एकाच वेळी आम्ही तुमच्या स्ट्रिंगसाठी उच्च-गुणवत्तेचा, अत्याधुनिक AI अनुवाद तयार करण्यासाठी असिंक्रोनस अनुवाद नोकरी सुरू करतो. AI अनुवाद तयार झाल्यावर तो मशीन अनुवादाची जागा घेवो आणि तुम्ही जेव्हा कधीही तुमच्या स्ट्रिंग्ससाठी अनुवाद मागवाल तेव्हा तो पाठवला जाईल.

जर तुम्ही एखादी स्ट्रिंग हाताने भाषांतरित केली असेल, तर ती भाषांतरं प्राधान्याने वापरली जातील आणि त्याऐवजी परत पाठवली जातील.

मूळांचा वापर

TacoTranslate प्रकल्पांमध्ये जे आम्ही ऑरिजिन्स म्हणतो ते असतात. त्यांना तुमच्या स्ट्रिंग्ज आणि अनुवादांसाठी प्रवेश बिंदू, फोल्डर किंवा गट म्हणून विचार करा.

import {TacoTranslate} from 'tacotranslate/react';

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

Origins तुम्हाला स्ट्रिंग्जना अर्थपूर्ण कंटेनरांमध्ये वेगळे करण्याची परवानगी देतात. उदाहरणार्थ, तुम्ही दस्तऐवजीकरणासाठी एक origin आणि तुमच्या विपणन पृष्ठासाठी दुसरे origin ठेवू शकता.

अधिक सूक्ष्म नियंत्रणासाठी, आपण घटक पातळीवर origins सेट करू शकता.

हे साध्य करण्यासाठी, आपल्या प्रकल्पात अनेक TacoTranslate प्रदाते वापरण्याचा विचार करा.

कृपया लक्षात घ्या की एकाच स्ट्रिंगला वेगवेगळ्या origins मध्ये वेगवेगळे अनुवाद मिळू शकतात.

शेवटी, तुम्ही स्ट्रिंग्सना ओरिजिनमध्ये कशा वेगवेगळ्या करता हे तुमच्यावर आणि तुमच्या गरजांवर अवलंबून असते. तथापि, लक्षात ठेवा की एका ओरिजिनमध्ये बऱ्याच स्ट्रिंग्स असल्यास लोड होण्याचा वेळ वाढू शकतो.

चरांची हाताळणी

गतिशील सामग्रीसाठी नेहमीच चल (variables) वापरावेत, जसे की वापरकर्त्यांची नावे, तारखा, ई-मेल पत्ते आणि बरेच काही.

स्ट्रिंगमधील व्हेरिएबल्स दुहेरी कोष्ठके वापरून घोषित केले जातात, जसे {{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}});
}

HTML सामग्रीचे व्यवस्थापन

डिफॉल्टनुसार, Translate घटक HTML सामग्रीचे समर्थन करतो आणि ती रेंडर करतो. तथापि, हा वर्तन टाळण्यासाठी तुम्ही useDangerouslySetInnerHTML ला false असे सेट करू शकता.

वापरकर्त्यांनी तयार केलेल्या सामग्रीसारख्या अविश्वासार्ह मजकूराचे अनुवाद करताना HTML रेंडरिंग अक्षम करणे दृढपणे शिफारस केले जाते.

सर्व आउटपुट प्रदर्शित करण्यापूर्वी नेहमीच sanitize-html वापरून शुद्ध केले जाते.

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

वरील उदाहरण साध्या मजकूराप्रमाणे प्रदर्शित होईल.

सर्व्हर-साइड रेंडरिंग