ਦਸਤਾਵੇਜ਼: 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 ਅਨੁਵਾਦ ਤਿਆਰ ਹੋ ਜਾਏਗਾ, ਇਹ ਮਸ਼ੀਨੀ ਅਨੁਵਾਦ ਦੀ ਥਾਂ ਲੈ ਲਵੇਗਾ ਅਤੇ ਜਦੋਂ ਵੀ ਤੁਸੀਂ ਆਪਣੇ ਸਟ੍ਰਿੰਗਾਂ ਲਈ ਅਨੁਵਾਦ ਮੰਗੋਗੇ, ਇਹ ਭੇਜਿਆ ਜਾਵੇਗਾ।

ਜੇ ਤੁਸੀਂ ਕਿਸੇ ਸਟ੍ਰਿੰਗ ਦਾ ਹੱਥੋਂ ਅਨੁਵਾਦ ਕੀਤਾ ਹੈ, ਤਾਂ ਉਹ ਅਨੁਵਾਦ ਪ੍ਰਾਥਮਿਕਤਾ ਵਾਲੇ ਮੰਨੇ ਜਾਂਦੇ ਹਨ ਅਤੇ ਉਹੀ ਵਾਪਸ ਦਿੱਤੇ ਜਾਂਦੇ ਹਨ।

Origins ਦੀ ਵਰਤੋਂ

TacoTranslate ਪ੍ਰੋਜੈਕਟਾਂ ਵਿੱਚ ਉਹ ਹੁੰਦੇ ਹਨ ਜੋ ਅਸੀਂ origins ਕਹਿੰਦੇ ਹਾਂ। ਇਨ੍ਹਾਂ ਨੂੰ ਆਪਣੀਆਂ ਸਟ੍ਰਿੰਗਜ਼ ਅਤੇ ਅਨੁਵਾਦਾਂ ਲਈ ਐਂਟਰੀ ਪੋਇੰਟ, ਫੋਲਡਰ ਜਾਂ ਗਰੁੱਪਾਂ ਵਜੋਂ ਸੋਚੋ।

import {TacoTranslate} from 'tacotranslate/react';

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

ਉਤਪੱਤੀਆਂ ਤੁਹਾਨੂੰ ਸਤਰਾਂ ਨੂੰ ਅਰਥਪੂਰਨ ਕੰਟੇਨਰਾਂ ਵਿੱਚ ਵੰਡਣ ਦਿੰਦੀਆਂ ਹਨ। ਉਦਾਹਰਨ ਵਜੋਂ, ਤੁਸੀਂ ਦਸਤਾਵੇਜ਼ਾਂ ਲਈ ਇੱਕ ਉਤਪੱਤੀ ਰੱਖ ਸਕਦੇ ਹੋ ਅਤੇ ਆਪਣੀ ਮਾਰਕੀਟਿੰਗ ਪੇਜ ਲਈ ਦੂਜੀ।

ਹੋਰ ਸੂਖਮ ਨਿਯੰਤਰਣ ਲਈ, ਤੁਸੀਂ ਕੰਪੋਨੈਂਟ ਪੱਧਰ 'ਤੇ origins ਸੈੱਟ ਕਰ ਸਕਦੇ ਹੋ।

ਇਸ ਨੂੰ ਪ੍ਰਾਪਤ ਕਰਨ ਲਈ, ਆਪਣੇ ਪ੍ਰੋਜੈਕਟ ਵਿੱਚ ਕਈ TacoTranslate ਪ੍ਰੋਵਾਈਡਰਾਂ ਦੀ ਵਰਤੋਂ ਕਰਨ ਬਾਰੇ ਵਿਚਾਰ ਕਰੋ।

ਕਿਰਪਾ ਕਰਕੇ ਧਿਆਨ ਦਿਓ ਕਿ ਇੱਕੋ ਹੀ ਸਟ੍ਰਿੰਗ ਵੱਖ-ਵੱਖ ਮੂਲਾਂ ਵਿੱਚ ਵੱਖ-ਵੱਖ ਅਨੁਵਾਦ ਪ੍ਰਾਪਤ ਕਰ ਸਕਦੀ ਹੈ।

ਅੰਤ ਵਿੱਚ, ਤੁਸੀਂ strings ਨੂੰ origins ਵਿੱਚ ਕਿਵੇਂ ਵੰਡਦੇ ਹੋ ਇਹ ਤੁਹਾਡੇ ਅਤੇ ਤੁਹਾਡੀਆਂ ਲੋੜਾਂ 'ਤੇ ਨਿਰਭਰ ਕਰਦਾ ਹੈ। ਹਾਲਾਂਕਿ, ਧਿਆਨ ਰੱਖੋ ਕਿ ਇੱਕ origin ਵਿੱਚ ਬਹੁਤ ਸਾਰੀਆਂ 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}});
}

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

ਉਪਰ ਦਿੱਤਾ ਉਦਾਹਰਨ ਸਾਧਾਰਣ ਪਾਠ ਵਜੋਂ ਦਰਸਾਇਆ ਜਾਵੇਗਾ।

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