డాక్యుమెంటేషన్: TacoTranslate ఉపయోగించడం

TacoTranslate ఉపయోగించడం

Telugu

స్ట్రింగ్స్ అనువాదం

ప్రస్తుతం స్ట్రింగ్స్‌ను అనువదించడానికి మూడు మార్గాలు ఉన్నాయి: 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 ను సెటప్ చేసుకోవచ్చు.

దీనిని సాధించడానికి, మీ ప్రాజెక్టులో పలు 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}
		/>
	);
}

ముందుగా తెలిపిన ఉదాహరణను సాధారణ పాఠ్యంగా ప్రదర్శిస్తారు.

సర్వర్-సైడ్ రెండరింగ్