TacoTranslate ಅನ್ನು ಬಳಸುವುದು
ಸ್ಟ್ರಿಂಗ್ಗಳನ್ನು ಅನುವಾದಿಸುವುದು
ಪ್ರಸ್ತುತ ಸ್ಟ್ರಿಂಗ್ಗಳನ್ನು ಅನುವಾದಿಸಲು ಮೂರು ಮಾರ್ಗಗಳಿವೆ: Translate ಕಂಪೋನಂಟ್, useTranslation ಹುಕ್, ಅಥವಾ translateEntries ಉಪಯುಕ್ತಿ.
Translate ಘಟಕವನ್ನು ಬಳಸುವುದು.
ಇದು ಅನುವಾದಗಳನ್ನು span ಎಲಿಮೆಂಟ್ ಒಳಗೆ ನೀಡುತ್ತದೆ ಮತ್ತು HTML ರೆಂಡರಿಂಗ್ ಅನ್ನು ಬೆಂಬಲಿಸುತ್ತದೆ.
import {Translate} from 'tacotranslate/react';
function Page() {
return <Translate string="Hello, world!" />;
}ಉದಾಹರಣೆಗೆ, ಕಂಪೋನಂಟ್ನಲ್ಲಿ as="p" ಅನ್ನು ಬಳಸಿ ಎಲೆಮೆಂಟ್ ಪ್ರಕಾರವನ್ನು ಬದಲಾಯಿಸಬಹುದು.
useTranslation hook ಅನ್ನು ಬಳಸುವುದು.
ಅನುವಾದಗಳನ್ನು ಸರಳ ಸ್ಟ್ರಿಂಗ್ ಆಗಿ ನೀಡುತ್ತದೆ. ಉದಾಹರಣೆಗೆ, 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 ಪ್ರಾಜೆಕ್ಟ್ಗಳಲ್ಲಿ ನಾವು ಮೂಲಗಳು ಎಂದು ಕರೆಯುವವುಗಳಿವೆ. ಅವುಗಳನ್ನು ನಿಮ್ಮ ಸ್ಟ್ರಿಂಗ್ಗಳು ಮತ್ತು ಅನುವಾದಗಳ ಪ್ರವೇಶ ಬಿಂದುಗಳು, ಫೋಲ್ಡರ್ಗಳು ಅಥವಾ ಗುಂಪುಗಳಾಗಿ ಪರಿಗಣಿಸಿ.
import {TacoTranslate} from 'tacotranslate/react';
function Menu() {
return (
<TacoTranslate origin="application-menu">
// ...
</TacoTranslate>
);
}ಆರಿಜಿನ್ಗಳು ನಿಮಗೆ ಸ್ಟ್ರಿಂಗ್ಗಳನ್ನು ಅರ್ಥಪೂರ್ಣ ಕಂಟೈನರ್ಗಳಲ್ಲಿ ವಿಭಜಿಸಲು ಅನುಮತಿಸುತ್ತವೆ. ಉದಾಹರಣೆಗೆ, ನೀವು ದಸ್ತಾವೇಜೀಕರಣಕ್ಕಾಗಿ ಒಂದು ಆರಿಜಿನ್ ಹೊಂದಬಹುದು ಮತ್ತು ನಿಮ್ಮ ಮಾರ್ಕೆಟಿಂಗ್ ಪುಟಕ್ಕಾಗಿ ಇನ್ನೊಂದು ಇರಬಹುದು.
ಹೆಚ್ಚು ಸೂಕ್ಷ್ಮ ನಿಯಂತ್ರಣಕ್ಕಾಗಿ, ನೀವು ಘಟಕದ ಮಟ್ಟದಲ್ಲಿ origins ಅನ್ನು ಸ್ಥಾಪಿಸಬಹುದು.
ಇದನ್ನು ಸಾಧಿಸಲು, ನಿಮ್ಮ ಯೋಜನೆಯಲ್ಲಿ ಬಹು TacoTranslate ಪ್ರೊವೈಡರ್ಗಳನ್ನು ಬಳಸುವುದನ್ನು ಪರಿಗಣಿಸಿ.
ದಯವಿಟ್ಟು ಗಮನಿಸಿ, ಒಂದೇ ಸ್ಟ್ರಿಂಗ್ ವಿಭಿನ್ನ ಮೂಲಗಳಲ್ಲಿ ವಿಭಿನ್ನ ಅನುವಾದಗಳನ್ನು ಹೊಂದಬಹುದು.
ಅಂತಿಮವಾಗಿ, ಸ್ಟ್ರಿಂಗ್ಗಳನ್ನು ಮೂಲಗಳಲ್ಲಿ ಹೇಗೆ ವಿಭಜಿಸುವುದು ಎಂಬುದು ನಿಮ್ಮ ಮತ್ತು ನಿಮ್ಮ ಅವಶ್ಯಕತೆಗಳ ಮೇಲೆ ಅವಲಂಬಿತವಾಗಿದೆ. ಆದರೆ, ಒಂದು ಮೂಲದಲ್ಲಿ ಬಹಳಷ್ಟು ಸ್ಟ್ರಿಂಗ್ಗಳು ಇದ್ದರೆ ಲೋಡಿಂಗ್ ಸಮಯ ಹೆಚ್ಚುವುದನ್ನು ಗಮನಿಸಿ.
ಚರಗಳ ನಿರ್ವಹಣೆ
ಬಳಕೆದಾರರ ಹೆಸರುಗಳು, ದಿನಾಂಕಗಳು, ಇ-ಮೇಲ್ ವಿಳಾಸಗಳು ಮತ್ತು ಇತ್ಯಾದಿಂತಹ ಡೈನಾಮಿಕ್ ವಿಷಯಗಳಿಗಾಗಿ ನೀವು 항상 ಚರಗಳನ್ನು (variables) ಬಳಸಬೇಕು.
ಸ್ಟ್ರಿಂಗ್ಗಳಲ್ಲಿ variables ಅನ್ನು double brackets ಬಳಸಿ ಘೋಷಿಸಲಾಗುತ್ತದೆ, ಉದಾಹರಣೆಗೆ {{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}
/>
);
}ಮೇಲಿನ ಉದಾಹರಣೆ ಸರಳ ಪಠ್ಯವಾಗಿ ಪ್ರದರ್ಶಿಸಲಾಗುತ್ತದೆ.