ডকুমেন্টেশন: উন্নত ব্যবহার

উন্নত ব্যবহার

Bengali

ডান থেকে বামে ভাষাগুলির পরিচালনা

TacoTranslate আপনার React অ্যাপ্লিকেশনগুলিতে আরবি এবং হিব্রু এর মতো ডান থেকে বামে (RTL) ভাষাগুলিকে সহজেই সমর্থন করার সুযোগ করে দেয়। RTL ভাষাগুলির সঠিক পরিচালনা নিশ্চিত করে যে আপনার কনটেন্ট ডান থেকে বামে পড়া ব্যবহারকারীদের জন্য সঠিকভাবে প্রদর্শিত হয়।

import {useTacoTranslate} from 'tacotranslate/react';

function Document() {
	const {locale, isRightToLeft} = useTacoTranslate();

	return (
		<html lang={locale} dir={isRightToLeft ? 'rtl' : 'ltr'}>
			<body>
				// ...
			</body>
		</html>
	);
}

আপনি সরবরাহকৃত isRightToLeftLocaleCode ফাংশনটি ব্যবহার করেও বর্তমান ভাষা React এর বাইরে পরীক্ষা করতে পারেন।

import {isRightToLeftLocaleCode} from 'tacotranslate';

function foo(locale = 'es') {
	const direction = isRightToLeftLocaleCode(locale) ? 'rtl' : 'ltr';
	// ...
}

অনুবাদ নিষ্ক্রিয় করা

কোনো স্ট্রিংয়ের নির্দিষ্ট অংশের অনুবাদ নিষ্ক্রিয় করতে বা নিশ্চিত করতে যে কিছু অংশ অপরিবর্তিত থাকবে, আপনি ট্রিপল স্কয়ার ব্র্যাকেট ব্যবহার করতে পারেন। এই ফিচারটি নাম, প্রযুক্তিগত শব্দ, বা যেকোনো অন্যান্য বিষয় যা অনুবাদ করা উচিত নয়, তাদের মূল ফরম্যাট বজায় রাখতে সাহায্য করে।

import {Translate} from 'tacotranslate/react';

function Component() {
	return (
		<Translate string="Hello, [[[TacoTranslate]]]!" />
	);
}

এই উদাহরণে, শব্দটি “TacoTranslate” অনূদিত হবে না এবং অপরিবর্তিত থাকবে।

একাধিক TacoTranslate প্রদানকারী

আমরা দৃঢ়ভাবে আপনার অ্যাপে একাধিক TacoTranslate প্রদানকারী ব্যবহার করার পরামর্শ দিই। এটি আপনার অনুবাদ এবং স্ট্রিংগুলোকে বিভিন্ন উৎস যেমন হেডার, ফুটার, বা নির্দিষ্ট অংশগুলিতে সংগঠিত করার জন্য সহায়ক।

আপনি এখানে উৎসগুলি ব্যবহার করার বিষয়ে আরও পড়তে পারেন।

TacoTranslate প্রদানকারীরা কোনো পিতামাতার প্রদানকারীর সেটিংস উত্তরাধিকার সূত্রে পায়, তাই আপনাকে অন্য কোনো সেটিংস পুনরাবৃত্তি করতে হবে না।

import createTacoTranslateClient from 'tacotranslate';
import {TacoTranslate} from 'tacotranslate/react';

const tacoTranslateClient = createTacoTranslateClient({apiKey: 'YOUR_API_KEY'});

function Header() {
	return (
		<TacoTranslate origin="header">
			// ...
		</TacoTranslate>
	);
}

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

export default function App() {
	return (
		<TacoTranslate client={tacoTranslateClient} origin="page" locale="es">
			<Header />
			<Menu />
		</TacoTranslate>
	);
}

মূলোনা বা লোকেল ওভাররাইড করা

একাধিক TacoTranslate প্রোভাইডার ব্যবহারের পাশাপাশি, আপনি Translate কম্পোনেন্ট এবং useTranslation হুক স্তরেও উভয়ই origin এবং locale ওভাররাইড করতে পারেন।

import {Translate, useTranslation} from 'tacotranslate/react';

function Greeting() {
	const spanishHello = useTranslation('Hello!', {locale: 'es'});

	return (
		<>
			{spanishHello}
			<Translate string="What’s up?" origin="greeting" />
		</>
	);
}

লোডিং পরিচালনা করা

ক্লায়েন্ট সাইডে ভাষা পরিবর্তনের সময়, ব্যবহারকারীর সংযোগ অনুযায়ী অনুবাদ সংগ্রহ করতে কিছুক্ষণ সময় নিতে পারে। আপনি পরিবর্তনের সময় ভিজ্যুয়াল প্রতিক্রিয়া প্রদানের মাধ্যমে ব্যবহারকারীর অভিজ্ঞতা উন্নত করতে একটি লোডিং নির্দেশক প্রদর্শন করতে পারেন।

import {useTacoTranslate} from 'tacotranslate/react';

function Component() {
	const {isLoading} = useTacoTranslate();

	return (
		isLoading ? 'Translations are loading...' : null
	);
}

বহুবচনীকরণ

বহুবচন এবং গণনাভিত্তিক লেবেলগুলি বিভিন্ন ভাষায় সঠিকভাবে প্রদর্শনের জন্য, এটি একটি শ্রেষ্ঠ অনুশীলন হিসাবে বিবেচিত হয়:

import {Translate, useLocale} from 'tacotranslate/react';

function PhotoCount() {
	const locale = useLocale();
	const count = 1;

	return count === 0 ? (
		<Translate string="You have no photos." />
	) : count === 1 ? (
		<Translate string="You have 1 photo." />
	) : (
		<Translate
			string="You have {{count}} photos."
			variables={{count: count.toLocaleString(locale)}}
		/>
	);
}

একাধিক ভাষা

একই অ্যাপ্লিকেশনের মধ্যে একাধিক ভাষা একসাথে সমর্থনের জন্য, আপনি বিভিন্ন locale মান সহ একাধিক TacoTranslate প্রদানকারী ব্যবহার করতে পারেন, যেমন নিচে দেখানো হয়েছে:

আপনি locale কম্পোনেন্ট বা হুক স্তরেও ওভাররাইড করতে পারেন।

import createTacoTranslateClient from 'tacotranslate';
import {TacoTranslate, Translate} from 'tacotranslate/react';

const tacoTranslateClient = createTacoTranslateClient({apiKey: 'YOUR_API_KEY'});

function Spanish() {
	return (
		<TacoTranslate locale="es">
			<Translate string="Hello, world in Spanish!" />
		</TacoTranslate>
	);
}

function Norwegian() {
	return (
		<TacoTranslate locale="no">
			<Translate string="Hello, world in Norwegian!" />
		</TacoTranslate>
	);
}

export default function App() {
	return (
		<TacoTranslate client={tacoTranslateClient} origin="page" locale="es">
			<Spanish />
			<Norwegian />
		</TacoTranslate>
	);
}

অনুবাদ আইডি ব্যবহার করা হচ্ছে

আপনি একই স্ট্রিংয়ের জন্য বিভিন্ন অনুবাদ বা অর্থ পরিচালনার জন্য Translate কম্পোনেন্টে একটি id যোগ করতে পারেন। এটি বিশেষভাবে কার্যকর যখন একই পাঠের প্রসঙ্গ অনুযায়ী বিভিন্ন অনুবাদ প্রয়োজন হয়। অনন্য আইডি বরাদ্দ করে, আপনি নিশ্চিত করতে পারেন যে স্ট্রিংয়ের প্রতিটি উদাহরণ其 নির্দিষ্ট অর্থ অনুযায়ী সঠিকভাবে অনূদিত হচ্ছে।

import {Translate} from 'tacotranslate/react';

function Header() {
	return (
		<Translate id="header" string="Login" />
	);
}

function Footer() {
	return (
		<Translate id="footer" string="Login" />
	);
}

উদাহরণস্বরূপ, header login হয়ত স্প্যানিশে অনূদিত হবে “Iniciar sesión”, এবং footer login হয়ত অনূদিত হবে “Acceder”।

শ্রেষ্ঠ অভ্যাসসমূহ