TacoTranslate ਦੀ ਵਰਤੋਂ ਕਰਦੇ ਹੋਏ
ਤਾਰੀਫ਼ੀਆਂ ਦਾ ਅਨੁਵਾਦ ਕਰਨਾ
ਹੁਣ ਇਸ ਸਮੇਂ ਟੈਕਸਟਾਂ ਨੂੰ ਅਨੁਵਾਦ ਕਰਨ ਦੇ ਤਿੰਨ ਤਰੀਕੇ ਹਨ: 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 ਤੁਹਾਨੂੰ ਸਟਰਿੰਗਸ ਨੂੰ ਮਾਇਨੇਦਾਰ ਕੰਟੇਨਰਾਂ ਵਿੱਚ ਵੰਡਣ ਦੀ ਆਗਿਆ ਦਿੰਦੇ ਹਨ। ਉਦਾਹਰਨ ਵਜੋਂ, ਤੁਹਾਡੇ ਕੋਲ ਇੱਕ documentation ਲਈ origin ਹੋ ਸਕਦਾ ਹੈ ਅਤੇ ਦੂਜਾ ਤੁਹਾਡੇ marketing page ਲਈ।
ਹੋਰ ਵਿਸਥਾਰਤ ਨਿਯੰਤਰਣ ਲਈ, ਤੁਸੀਂ ਕੰਪੋਨੈਂਟ ਪੱਧਰ 'ਤੇ 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}
/>
);
}
ਉਪਰ ਦਿੱਤਾ ਉਦਾਹਰਨ ਸਧਾਰਣ ਪਾਠ ਵਜੋਂ ਦਰਸਾਇਆ ਜਾਵੇਗਾ।