ਦਸਤਾਵੇਜ਼: TacoTranslate ਦੀ ਵਰਤੋਂ

TacoTranslate ਦਾ ਉਪਯੋਗ ਕਰਨਾ

Punjabi

ਸਟ੍ਰਿੰਗਸ ਦਾ ਅਨੁਵਾਦ ਕਰਨਾ

ਹੁਣ ਇਸ ਸਮੇਂ ਸਤਰਾਂ ਦਾ ਅਨੁਵਾਦ ਕਰਨ ਦੇ ਤਿੰਨ ਤਰੀਕੇ ਹਨ: 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}});
}

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}
		/>
	);
}

ਉਪਰ ਦਿੱਤਾ ਉਦਾਹਰਨ ਸਧਾਰਨ ਲਿਖਤ ਵਜੋਂ ਰੇਂਡਰ ਕੀਤਾ ਜਾਵੇਗਾ।

ਸਰਵਰ-ਸਾਈਡ ਰੇਂਡਰਿੰਗ