دستاویزات: 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 کہتے ہیں۔ انہیں اپنے strings اور translations کے لیے انٹری پوائنٹس، فولڈرز، یا گروپس سمجھیں۔

import {TacoTranslate} from 'tacotranslate/react';

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

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

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

اسے حاصل کرنے کے لیے، اپنے پروجیکٹ میں متعدد TacoTranslate فراہم کنندگان استعمال کرنے پر غور کریں۔

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

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

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

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

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

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

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