دستاویزات: TacoTranslate کا استعمال

TacoTranslate کا استعمال

Urdu

اسٹرنگز کا ترجمہ کرنا

اس وقت اسٹرنگز کو ترجمہ کرنے کے تین طریقے ہیں: 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 آپ کو سٹرنگز کو معنی خیز کنٹینرز میں جدا کرنے دیتے ہیں۔ مثال کے طور پر، آپ کے پاس ایک origin دستاویزات کے لیے ہو سکتا ہے اور دوسرا آپ کے مارکیٹنگ پیج کے لیے۔

زیادہ باریک بینی سے کنٹرول کے لیے، آپ کمپونینٹ کی سطح پر 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}});
}

ایچ ٹی ایم ایل مواد کا انتظام کرنا

ڈیفالٹ کے طور پر، 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}
		/>
	);
}

اوپر دیا گیا مثال سادہ متن کی صورت میں ظاہر ہوگا۔

سرور-سائیڈ رینڈرنگ