TacoTranslate
/
ഡോക്യുമെന്റേഷൻവിലകൾ
 
  1. പരിചയം
  2. ആരഭിക്കുക
  3. സജ്ജീകരണവും കോൺഫിഗറേഷനും
  4. TacoTranslate ഉപയോഗിക്കൽ
  5. സെർവർ-സൈഡ് റെൻഡറിംഗ്
  6. ഉന്നത ഉപയോഗം
  7. മികച്ച രീതികൾ
  8. പിശക് കൈകാര്യം ചെയ്യലും ഡീബഗിംഗും
  9. പിന്തുണയുള്ള ഭാഷകൾ

TacoTranslate ഉപയോഗിക്കൽ

സ്ട്രിങ്ങുകൾ വിവർത്തനം ചെയ്യൽ

നിലവിൽ സ്ട്രിങ്ങുകൾ വിവർത്തനം ചെയ്യാനുള്ള മൂന്ന് മാർഗങ്ങളുണ്ട്: 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 വിവർത്തനം തയ്യാറായാൽ അത് മെഷീൻ വിവർത്തനത്തെ മാറ്റിവെക്കും — പിന്നീട് നിങ്ങൾ നിങ്ങളുടെ സ്ട്രിംഗുകളുടെ വിവർത്തനങ്ങൾ അഭ്യർത്ഥിക്കുമ്പോൾ അത് അയക്കപ്പെടും.

നിങ്ങൾ ഒരു സ്ട്രിംഗ് മാനുവലായി പരിഭാഷപ്പെടുത്തിയിട്ടുണ്ടെങ്കിൽ, ആ പരിഭാഷകൾക്ക് മുൻഗണന നൽകപ്പെടുകയും പകരം അവ തിരിച്ചുനൽകപ്പെടുകയും ചെയ്യും.

ഓറിജിനുകൾ ഉപയോഗിക്കൽ

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}
		/>
	);
}

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

സെർവർ-സൈഡ് റെൻഡറിംഗ്

Nattskiftet-ൽ നിന്നുള്ള ഒരു ഉൽപ്പന്നംനോർവെയിൽ നിർമ്മിച്ചത്