Dokümantasyon: TacoTranslate Kullanımı

TacoTranslate Kullanımı

Turkish

Dizelerin çevrilmesi

Şu anda dizeleri çevirmek için üç yol vardır: Translate bileşeni, useTranslation hook'u veya translateEntries yardımcı programı.

Translate bileşeninin kullanımı.
Çevirileri bir span öğesi içinde gösterir ve HTML olarak render etmeyi destekler.

import {Translate} from 'tacotranslate/react';

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

Örneğin bileşende as="p" kullanarak element türünü değiştirebilirsiniz.

useTranslation kancasının kullanımı.
Çevirileri düz metin olarak döndürür. Örneğin meta etiketlerinde kullanışlıdır.

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 yardımcı aracını kullanma.
Sunucu tarafında metinleri çevirin. OpenGraph görsellerinizi güçlendirin.

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

Metinler sunucularımıza ulaştığında önce doğrulayıp kaydediyoruz, ardından hemen bir makine çevirisi döndürüyoruz. Makine çevirileri genellikle yapay zeka çevirilerimize kıyasla daha düşük kalitede olmakla birlikte hızlı bir ilk yanıt sağlar.

Aynı anda, metniniz için yüksek kaliteli, son teknoloji yapay zeka çevirisi üretmek üzere eşzamansız bir çeviri işi başlatıyoruz. Yapay zeka çevirisi hazır olduğunda, makine çevirisinin yerini alacak ve metinleriniz için çeviri talep ettiğinizde gönderilecektir.

Bir dizeyi manuel olarak çevirdiyseniz, bu çeviriler önceliklidir ve döndürülür.

Orijinlerin Kullanımı

TacoTranslate projeleri, bizim orijinler dediğimiz öğeleri içerir. Onları metinleriniz ve çevirileriniz için giriş noktaları, klasörler veya gruplar olarak düşünün.

import {TacoTranslate} from 'tacotranslate/react';

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

Origins, dizeleri anlamlı kapsayıcılara ayırmanıza olanak tanır. Örneğin, belgeler için bir origin, pazarlama sayfanız için başka bir origin kullanabilirsiniz.

Daha hassas kontrol için origin'leri bileşen düzeyinde ayarlayabilirsiniz.

Bunu başarmak için, birden fazla TacoTranslate sağlayıcısı kullanmayı projenizde değerlendirin.

Lütfen aynı dizenin farklı origin'lerde farklı çeviriler alabileceğini unutmayın.

Sonuç olarak, dizileri origin'lere nasıl ayıracağınız size ve ihtiyaçlarınıza bağlıdır. Ancak, tek bir origin içinde çok sayıda dize bulunmasının yükleme sürelerini artırabileceğini unutmayın.

Değişkenleri İşleme

Kullanıcı adları, tarihler, e-posta adresleri gibi dinamik içerikler için her zaman değişkenler kullanmalısınız.

Dize içindeki değişkenler çift süslü parantez kullanılarak tanımlanır, örneğin {{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 içeriğini yönetme

Varsayılan olarak, Translate bileşeni HTML içeriğini destekler ve render eder. Ancak, bu davranışı devre dışı bırakmak için useDangerouslySetInnerHTML değerini false olarak ayarlayabilirsiniz.

Kullanıcı tarafından oluşturulan içerik gibi güvenilmeyen içeriği çevirirken HTML işlemeyi devre dışı bırakmanız şiddetle önerilir.

Tüm çıktılar, görüntülenmeden önce her zaman sanitize-html ile temizlenir.

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

Yukarıdaki örnek düz metin olarak görüntülenecektir.

Sunucu tarafı oluşturma

TacoTranslate Kullanımı

Metinler nasıl çevrilir

Orijinlerin Kullanımı

Değişkenleri İşleme

HTML içeriğini yönetme