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 ਤੁਹਾਨੂੰ ਸਤਰਾਂ ਨੂੰ ਮਾਇਨੇਦਾਰ ਕੰਟੇਨਰਾਂ ਵਿੱਚ ਵੰਡਣ ਦੀ ਆਗਿਆ ਦਿੰਦੇ ਹਨ। ਉਦਾਹਰਨ ਵਜੋਂ, ਤੁਹਾਡੇ ਕੋਲ ਦਸਤਾਵੇਜ਼ੀकरण ਲਈ ਇੱਕ 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}
/>
);
}
ਉੱਪਰ ਦਿੱਤਾ ਉਦਾਹਰਣ ਸਧਾਰਣ ਪਾਠ ਵਜੋਂ ਦਰਸਾਇਆ ਜਾਵੇਗਾ।