Belgeleme: TacoTranslate Kullanımı

TacoTranslate Kullanımı

Turkish

Dizeleri tercüme etme

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

Translate bileşenini kullanmak.
Çevirileri bir span elementi içinde çıktı olarak verir ve HTML renderlamayı destekler.

import {Translate} from 'tacotranslate/react';

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

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

useTranslation kancasını kullanmak.
Çevirileri sade bir 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 aracını kullanmak.
Sunucu tarafında dizeleri ç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)
	};
}

Dizeler sunucularımıza ulaştığında, önce onları doğrular ve kaydederiz, ardından hemen bir makine çevirisi döneriz. Makine çevirileri genellikle AI çevirilerimize kıyasla daha düşük kalitededir, ancak hızlı bir ilk yanıt sağlarlar.

Eşzamanlı olarak, dizeniz için yüksek kaliteli, son teknoloji bir yapay zeka çevirisi oluşturmak üzere eşzamansız bir çeviri işi başlatıyoruz. Yapay zeka çevirisi hazır olduğunda, makine çevirisinin yerine geçecek ve dizelerinizin çevirilerini talep ettiğinizde gönderilecektir.

Eğer bir dizeyi manuel olarak çevirdiyseniz, bu çeviriler öncelik kazanır ve onun yerine döndürülür.

Kökenlerin Kullanımı

TacoTranslate projeleri, bizim orijinler olarak adlandırdığımız şeyleri içerir. Bunları metinleriniz ve çevirileriniz için giriş noktaları, klasörler veya gruplar olarak düşünebilirsiniz.

import {TacoTranslate} from 'tacotranslate/react';

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

Origins, metinleri anlamlı kapsayıcılara ayırmanızı sağlar. Örneğin, bir origin dokümantasyon için, diğeri pazarlama sayfanız için olabilir.

Daha ayrıntılı kontrol için, kökenleri bileşen seviyesinde ayarlayabilirsiniz.

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

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

Sonuç olarak, dizeleri kökenlere ayırma şekliniz size ve ihtiyaçlarınıza bağlıdır. Ancak, bir kökende çok sayıda dize bulunmasının yükleme sürelerini artırabileceğini unutmayın.

Değişkenlerin Yönetimi

Dinamik içerik için, kullanıcı adları, tarihler, e-posta adresleri ve benzerleri gibi, her zaman değişkenler kullanmalısınız.

Dizelerdeki değişkenler, {{variable}} gibi çift parantez kullanılarak tanımlanır.

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ğinin yönetimi

Varsayılan olarak, Translate bileşeni HTML içeriğini destekler ve işler. Ancak, bu davranışı useDangerouslySetInnerHTML öğesini false olarak ayarlayarak devre dışı bırakabilirsiniz.

HTML render'ını devre dışı bırakmak, kullanıcı tarafından oluşturulan içerik gibi güvenilmeyen içerikler çevrilirken şiddetle tavsiye edilir.

Tüm çıktılar her zaman render edilmeden önce 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 render edilecektir.

Sunucu tarafı renderlama

TacoTranslate Kullanımı

Dizeler nasıl çevrilir

Kökenlerin Kullanımı

Değişkenlerin Yönetimi

HTML içeriğinin yönetimi