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

TacoTranslate کا استعمال

Urdu

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

اس وقت strings ترجمہ کرنے کے تین طریقے ہیں: 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 کہتے ہیں۔ آپ انہیں اپنے strings اور translations کے لیے entry points، فولڈرز، یا گروپس کے طور پر سوچ سکتے ہیں۔

import {TacoTranslate} from 'tacotranslate/react';

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

Origins آپ کو سٹرنگز کو معنادار کنٹینرز میں الگ کرنے کی اجازت دیتے ہیں۔ مثال کے طور پر، آپ کے پاس دستاویزات کے لیے ایک origin ہو سکتا ہے اور مارکیٹنگ پیج کے لیے دوسرا۔

زیادہ باریک بینی سے کنٹرول کے لیے، آپ کمپونینٹ کی سطح پر origins سیٹ اپ کر سکتے ہیں۔

اس کو حاصل کرنے کے لیے، اپنے پروجیکٹ میں متعدد TacoTranslate پرووائیڈرز استعمال کرنے پر غور کریں۔

براہ کرم نوٹ کریں کہ ایک ہی سٹرنگ مختلف origins میں مختلف تراجم حاصل کر سکتی ہے۔

آخرکار، آپ سٹرنگز کو اوریجنز میں کس طرح تقسیم کرتے ہیں یہ آپ اور آپ کی ضروریات پر منحصر ہے۔ تاہم، نوٹ کریں کہ ایک اوریجن میں بہت سی سٹرنگز ہونے کی صورت میں لوڈنگ کے اوقات بڑھ سکتے ہیں۔

متغیرات کا انتظام

آپ کو ہمیشہ متحرک مواد کے لیے متغیرات استعمال کرنے چاہئیں، جیسے صارف کے نام، تاریخیں، ای میل ایڈریسز، اور مزید۔

Strings میں متغیرات کو ڈبل بریکٹ کے ذریعے ظاہر کیا جاتا ہے، جیسے {{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}
		/>
	);
}

مندرجہ بالا مثال سادہ متن کے طور پر رینڈر کی جائے گی۔

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