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

એકસાથે, અમે તમારા સ્ટ્રિંગ માટે ઉચ્ચ ગુણવattaા, અદ્યતન AI અનુવાદ ઉત્પન્ન કરવા માટે એક અસંક્રામક અનુવાદ કાર્ય શરૂ કરીએ છીએ. જ્યારે AI અનુવાદ તૈયાર થાય ત્યારે તે મશીન અનુવાદને બદલી દેશે અને જ્યારે પણ તમે તમારા સ્ટ્રિંગ્સ માટે અનુવાદ માંગશો ત્યારે મોકલવામાં આવશે.

જો તમે સ્ટ્રિંગને મેન્યુઅલી અનુવાદ કર્યો હોય, તો તે અનુવાદોને પ્રાધાન્ય આપવામાં આવે છે અને તેનું જ પ્રદર્શિત ફળતં આપવામાં આવે છે.

ઉત્સનો ઉપયોગ કરવો

TacoTranslate પ્રોજેક્ટમાં તે હોય છે જેને અમે origins કહેવા માટે կան. તેમને તમારી સ્ટ્રિંગ્સ અને અનુવાદો માટે પ્રવેશ બિંદુઓ, ફોલ્ડરો અથવા સમૂહો તરીકે સમજો.

import {TacoTranslate} from 'tacotranslate/react';

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

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

વધારે સૂક્ષ્મ નિયંત્રણ માટે, તમે કમ્પોનન્ટ સ્તરે ઓરિજિન સેટ અપ કરી શકો છો.

આને માટે, તમારા પ્રોજેક્ટમાં ઘણા TacoTranslate પ્રોવાઇડરોનો ઉપયોગ કરવાની વિચારણા કરો.

કૃપા કરીને નોંધો કે એ જ શબ્દશેણી વિવિધ ઓરિઝિન્સમાં વિવિધ અનુવાદ મેળવી શકે છે.

આખરે, તમે સ્ટ્રિંગ્સને origin માં કેવી રીતે અલગ કરશો તે તમારા અને તમારી જરૂરિયાતો પર નિર્ભર છે. જોકે, ધ્યાન રાખો કે એક 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}
		/>
	);
}

ઉપરોક્ત ઉદાહરણ શીર્ષક રૂપે રજૂ કરવામાં આવશે.

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