दस्तऐवज: 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 प्रदाते वापरण्याचा विचार करा.

कृपया लक्षात घ्या की एकाच स्ट्रिंगला वेगवेगळ्या 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}
		/>
	);
}

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

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