Merkkijonojen kääntäminen

Tällä hetkellä on kolme tapaa kääntää merkkijonoja: Translate-komponentti, useTranslation-hook tai translateEntries-apufunktio.

Translate -komponentin käyttäminen.
Tuottaa käännökset span -elementin sisälle ja tukee HTML:n renderöintiä.

import {Translate} from 'tacotranslate/react';

function Page() {
	return <Translate string="Hello, world!" />;
}

Voit muuttaa elementin tyyppiä käyttämällä esimerkiksi as="p" komponentissa.

useTranslation-hookin käyttäminen.
Palauttaa käännökset tavallisena merkkijonona. Hyödyllinen esimerkiksi meta-tageissa.

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-apuohjelman käyttäminen.
Käännä merkkijonoja palvelinpuolella. Tehosta OpenGraph-kuviasi.

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

Miten merkkijonot käännetään

Kun merkkijonot saapuvat palvelimillemme, validoimme ja tallennamme ne ensin, minkä jälkeen palautamme välittömästi konekäännöksen. Vaikka konekäännökset ovat yleensä laadultaan heikompia verrattuna tekoälykäännöksiimme, ne tarjoavat nopean alustavan vastauksen.

Samaan aikaan aloitamme asynkronisen käännöstyön tuottaaksemme korkealaatuisen, huippuluokan tekoälykäännöksen merkkijonollesi. Kun tekoälykäännös on valmis, se korvaa konekäännöksen, ja se lähetetään aina, kun pyydät käännöksiä merkkijonoillesi.

Jos olet kääntänyt merkkijonon manuaalisesti, nämä käännökset menevät etusijalle ja palautetaan sen sijaan.

Originien käyttäminen

TacoTranslate-projekteissa on sitä, mitä kutsumme origins. Ajattele niitä sisäänkäynteinä, kansioina tai ryhminä merkkijonoillesi ja käännöksillesi.

Originit antavat sinun erottaa merkkijonot merkityksellisiin ryhmiin. Esimerkiksi voit käyttää yhtä originia dokumentaatiolle ja toista markkinointisivullesi.

Tarkempaa hallintaa varten voit määrittää originit komponenttitasolla.

Saavuttaaksesi tämän, harkitse useiden TacoTranslate-palveluntarjoajien käyttöä projektissasi.

Huomaa, että saman merkkijonon käännökset voivat vaihdella eri originien välillä.

Lopulta se, miten jaat merkkijonot eri originien välillä, on sinun päätettävissäsi ja riippuu tarpeistasi. Huomaa kuitenkin, että jos yhdessä originissa on paljon merkkijonoja, latausajat saattavat kasvaa.

Muuttujien käsittely

Sinun tulisi aina käyttää muuttujia dynaamiseen sisältöön, kuten käyttäjänimiin, päivämääriin, sähköpostiosoitteisiin ja muihin.

Merkkijonoissa olevat muuttujat ilmoitetaan käyttämällä kaksinkertaisia aaltosulkeita, kuten {{variable}}.

HTML-sisällön hallinta

Oletusarvoisesti Translate komponentti tukee ja renderöi HTML-sisältöä. Voit kuitenkin poistaa tämän käytöstä asettamalla useDangerouslySetInnerHTML arvoksi false.

HTML-renderoinnin poistaminen käytöstä on vahvasti suositeltavaa, kun käännetään epäluotettavaa sisältöä, kuten käyttäjien luomaa sisältöä.

Kaikki sisältö puhdistetaan aina sanitize-html avulla ennen renderöintiä.

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

Yllä oleva esimerkki renderöidään tavallisena tekstinä.