ಡಾಕ್ಯುಮೆಂಟೇಶನ್: TacoTranslate ಬಳಸುವುದು

TacoTranslate ಬಳಸಿ

Kannada

ಸ್ಟ್ರಿಂಗ್‌ಗಳನ್ನು ಅನುವಾದಿಸುವುದು

ಪ್ರಸ್ತುತ ಸ್ಟ್ರಿಂಗ್‌ಗಳನ್ನು ಅನುವಾದಿಸುವ ಮೂರು ಮಾರ್ಗಗಳಿವೆ: 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}
		/>
	);
}

ಮೇಲಿನ ಉದಾಹರಣೆಯನ್ನು ಸಾಮಾನ್ಯ ಪಠ್ಯವಾಗಿ ಪ್ರದರ್ಶಿಸಲಾಗುತ್ತದೆ.

ಸರ್ವರ್-ಸೈಡ್ ರೆಂಡರಿಂಗ್