ਡੌਕਯੂਮੈਂਟੇਸ਼ਨ: 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 ਤੁਹਾਨੂੰ ਸਟ੍ਰਿੰਗਾਂ ਨੂੰ ਮਾਇਨੇਦਾਰ ਕੰਟੇਨਰਾਂ ਵਿੱਚ ਵੰਡਣ ਦੀ ਆਗਿਆ ਦਿੰਦੇ ਹਨ। ਉਦਾਹਰਨ ਲਈ, ਤੁਸੀਂ ਦਸਤਾਵੇਜ਼ੀਕਰਨ ਲਈ ਇੱਕ ਓਰੀਜਿਨ ਰੱਖ ਸਕਦੇ ਹੋ ਅਤੇ ਆਪਣੇ ਮਾਰਕੀਟਿੰਗ ਪੇਜ਼ ਲਈ ਦੂਜਾ।

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

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

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

ਅੰਤ ਵਿੱਚ, ਤੁਸੀਂ ਸਟ੍ਰਿੰਗਾਂ ਨੂੰ origins ਵਿੱਚ ਕਿਵੇਂ ਵੰਡਦੇ ਹੋ, ਇਹ ਤੁਹਾਡੇ ਅਤੇ ਤੁਹਾਡੀਆਂ ਜ਼ਰੂਰਤਾਂ 'ਤੇ ਨਿਰਭਰ ਕਰਦਾ ਹੈ। ਹਾਲਾਂਕਿ, ਧਿਆਨ ਰੱਖੋ ਕਿ ਇੱਕੇ origin ਵਿੱਚ ਬਹੁਤ ਸਾਰੀਆਂ ਸਟ੍ਰਿੰਗਾਂ ਹੋਣ ਨਾਲ ਲੋਡਿੰਗ ਸਮਿਆਂ ਵਿੱਚ ਵਾਧਾ ਹੋ ਸਕਦਾ ਹੈ।

ਵੈਰੀਏਬਲਾਂ ਨੂੰ ਸੰਭਾਲਣਾ

ਤੁਹਾਨੂੰ ਹਮੇਸ਼ਾ ਡਾਇਨਾਮਿਕ ਸਮੱਗਰੀ ਲਈ ਵੈਰੀਏਬਲਾਂ ਦੀ ਵਰਤੋਂ ਕਰਨੀ ਚਾਹੀਦੀ ਹੈ, ਜਿਵੇਂ ਕਿ ਯੂਜ਼ਰ ਨਾਂ, ਤਰੀਖਾਂ, ਈ-ਮੇਲ ਪਤੇ ਅਤੇ ਹੋਰ।

ਸਤ੍ਰਿੰਗਾਂ ਵਿੱਚ ਵੈਰੀਏਬਲ ਦੋਹਰੇ ਬ੍ਰੈਕਟਾਂ ਦੀ ਵਰਤੋਂ ਨਾਲ ਦਰਜ ਕੀਤੇ ਜਾਂਦੇ ਹਨ, ਜਿਵੇਂ {{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}
		/>
	);
}

ਉਪਰੋਕਤ ਉਦਾਹਰਨ ਸਾਦੇ ਟੈਕਸਟ ਵਜੋਂ ਰੈਂਡਰ ਕੀਤੀ ਜਾਵੇਗੀ।

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