ડોક્યુમેન્ટેશન: TacoTranslate નો ઉપયોગ

TacoTranslate નો ઉપયોગ

Gujarati

સ્ટ્રિંગ્સનું ભાષાંતર

હાલમાં સ્ટ્રિંગ્સ અનુવાદ કરવાની ત્રણ રીતો છે: 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 પ્રોજેક્ટોમાં એવી વસ્તુઓ હોય છે જેને અમે ઓરિજિન્સ કહીએ છીએ. તેમને તમારા સ્ટ્રિંગ્સ અને અનુવાદો માટેના પ્રવેશ બિંદુઓ, ફોલ્ડર્સ અથવા જૂથો તરીકે સમજો.

import {TacoTranslate} from 'tacotranslate/react';

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

ઓરિજિન્સ તમને સ્ટ્રિંગ્સને અર્થપૂર્ણ કન્ટેનરોમાં અલગ કરવા દે છે. ઉદાહરણ તરીકે, ડોક્યુમેન્ટેશન માટે એક ઓરિજિન અને તમારા માર્કેટિંગ પૃષ્ઠ માટે બીજો ઓરિજિન હોઈ શકે છે.

વધુ બારીક નિયંત્રણ માટે, તમે ઘટક સ્તરે origins ગોઠવી શકો છો.

આને હાંસલ કરવા માટે, એકથી વધુ TacoTranslate પ્રોવાઈડરોનો ઉપયોગ તમારા પ્રોજેક્ટમાં કરવાનો વિચાર કરો.

કૃપા કરીને નોંધો કે એક જ સ્ટ્રિંગ વિવિધ ઓરિજિન્સમાં અલગ ભાષાંતર મેળવી શકે છે.

આખરે, સ્ટ્રિંગ્સને ઓરિજિન્સમાં કેવી રીતે વહેંચશો તે તમે અને તમારી જરૂરિયાતો પર નિર્ભર છે. જોકે, એક જ ઓરિજિનમાં ઘણી સ્ટ્રિંગ્સ હોય તો લોડિંગ સમય વધે શકે છે.

વેરિએબલ્સનું સંચાલન

ડાયનામિક સામગ્રી માટે હંમેશા વેરિએબલ્સનો ઉપયોગ કરો, જેમ કે વપરાશકર્તાના નામો, તારીખો, ઇમેઇલ સરનામા અને વધુ.

સ્ટ્રિંગ્સમાં વેરિએબલ્સને ડબલ બ્રેકેટ્સનો ઉપયોગ કરીને ઘોષિત કરવામાં આવે છે, જેમ કે {{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}
		/>
	);
}

ઉપરોક્ત ઉદાહરણ સાદા લખાણ તરીકે પ્રદર્શિત કરવામાં આવશે.

સર્વર-સાઇડ રેન્ડરિંગ