દસ્તાવેજીકરણ: TacoTranslate નો ઉપયોગ

TacoTranslate નો ઉપયોગ કરવું

Gujarati

સ્ટ્રિંગ્સ અનુવાદ કરી રહ્યા છે

હાલમાં ત્રણે રીત છે જે_strings_ને અનુવાદ કરવા માટે: 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 પ્રოვાઇડરોનો ઉપયોગ કરવાનો વિચાર કરો.

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

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

ચર બદલવાની વ્યવસ્થા કરવી

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

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

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

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