दस्तऐवज: 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 अनुवाद तयार होईल, तेव्हा तो मशीन अनुवादाची जागा घेईल आणि जेव्हा आपण आपल्या स्ट्रिंगसाठी अनुवादांची विनंती कराल तेव्हा तो पाठवला जाईल.

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

मुळ स्रोतांचा वापर करणं

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

import {TacoTranslate} from 'tacotranslate/react';

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

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

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

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

कृपया लक्षात घ्या की वेगवेगळ्या origins मध्ये समान स्ट्रिंगसाठी वेगवेगळ्या भाषांतरं मिळू शकतात.

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

चलांच्या हाताळणी

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

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

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

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