दस्तऐवजीकरण: 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 प्रकल्पांमध्ये जे आपण origins म्हणतो ते असतात. त्यांना आपल्या स्ट्रिंग्ज आणि भाषांतरांसाठी प्रवेश बिंदू, फोल्डर किंवा गट म्हणून विचार करा.

import {TacoTranslate} from 'tacotranslate/react';

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

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

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

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

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

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

चल हाताळणे

वापरकर्त्यांची नावे, तारखा, ई‑मेल पत्ते आणि इतर सारख्या गतिशील सामग्रीसाठी तुम्ही नेहमीच व्हेरिएबल्स वापरावेत.

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

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

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