1. അറിയിപ്പ്
  2. തുടങ്ങുന്നു
  3. സജ്ജീകരണം 및 ക്രമീകരണം
  4. ടാക്കോทรാന്‍സ്ലേറ്റും பயன்படுத்தൽ
  5. സർവർ-സൈറ്റിൽ റെണ്ടറിംഗ്
  6. അതിനിടയിൽ ഉപയോഗം
  7. മികവുറ്റ പ്രഥമിക രീതികൾ
  8. പിശക് കൈകാര്യം ചെയ്യലും ഡീബగ్గിംഗും
  9. അംഗീകരിച്ച ഭാഷകൾ

ടാക്കോทรാന്‍സ്ലേറ്റും பயன்படுத்தൽ

സ്ട്രിംഗുകൾ തർജ്ജമ ചെയ്യുന്നു

ഇപ്പോൾ സ്ട്രിങ്ങുകൾ വിവർത്തനം ചെയ്യാൻ മൂന്ന് മാർഗങ്ങൾ ഉണ്ട്: 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}
		/>
	);
}

മുകളിൽ കാണിച്ച ഉദാഹരണം പ്ലെയിൻ ടെക്സ്റ്റായി പ്രദർശിപ്പിക്കും.

നാറ്റ്‌സ്‌കിഫ്റ്റെറ്റ് നിന്നുള്ള ഒരു ഉൽപ്പന്നംനോർവേയിൽ നിർമ്മിച്ചത്