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 വിവർത്തനം ഉണ്ടാകുന്നതിന് ഞങ്ങൾ ഒരു അസിങ്ക്രോണസ് വിവർത്തന ജോബ് ആരംഭിക്കുന്നു. AI വിവർത്തനം തയ്യാറായാൽ, അത് മെഷീൻ വിവർത്തനത്തിന് പകരം വന്ന് നിങ്ങളുടെ സ്ട്രിംഗുകൾക്ക് വിവർത്തനങ്ങൾ അഭ്യർത്ഥിക്കുമ്പോൾ അയക്കപ്പെടും

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

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

TacoTranslate പദ്ധതികളിൽ ഞങ്ങൾ origins എന്നറിയുന്ന ഘടകങ്ങൾ ഉൾപ്പെടുന്നു. അവയെ നിങ്ങളുടെ സ്ട്രിംഗുകൾക്കും വിവർത്തനങ്ങൾക്കും വേണ്ടി എൻട്രി പോയിന്റുകൾ, ഫോൾഡറുകൾ അല്ലെങ്കിൽ ഗ്രൂപ്പുകൾ എന്നിങ്ങനെ കരുതുക.

import {TacoTranslate} from 'tacotranslate/react';

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

Origins നിങ്ങളെ സ്ട്രിങ്ങുകൾ അർത്ഥപൂര്‍ണമായ കണ്ടെയ്‌നറുകളായി വേർതിരിക്കാൻ അനുവദിക്കുന്നു. ഉദാഹരണത്തിന്, ഡോക്യുമെന്റേഷനായി ഒരു ഓറിജിൻ ഉണ്ടായിരിക്കാം, മറ്റൊന്ന് നിങ്ങളുടെ മാർക്കറ്റിംഗ് പേജിനായി.

കൂടുതൽ സൂക്ഷ്മ നിയന്ത്രണത്തിനായി, നിങ്ങൾ ഘടക നിരയിൽ ഓറിജിനുകൾ സജ്ജീകരിക്കാവുന്നതാണ്.

ഇത് കൈവരിക്കാൻ, നിങ്ങളുടെ പ്രോജക്റ്റിൽ പല TacoTranslate പ്രൊവൈഡർമാരെ ഉപയോഗിക്കാൻ പരിഗണിക്കുക.

ദയവായി ശ്രദ്ധിക്കുക: ഒരേ സ്ട്രിംഗ് വിവിധ Origins-കളിൽ വ്യത്യസ്ഥമായ പരിഭാഷകൾ ഉണ്ടാകാവുന്നതാണ്.

അവസാനമായി, സ്ട്രിങ്ങുകൾ ഏത് 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}
		/>
	);
}

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

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

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