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

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

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

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

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 হুক স্তরে উভয়ই অরিজিন এবং লোকেল ওভাররাইড করতে পারেন।

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 যোগ করতে পারেন। এটি বিশেষভাবে উপযোগী যখন একই টেক্সটের প্রসঙ্গ অনুযায়ী বিভিন্ন অনুবাদ প্রয়োজন হয়। অনন্য ID দিয়ে প্রতিটি স্ট্রিংয়ের উদাহরণ নির্দিষ্ট অর্থ অনুসারে সঠিকভাবে অনূদিত হচ্ছে তা নিশ্চিত করতে পারবেন।

import {Translate} from 'tacotranslate/react';

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

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

উদাহরণস্বরূপ, হেডার লগইন হতে পারে “Iniciar sesión” তে অনূদিত, এবং ফুটার লগইন হতে পারে “Acceder” স্প্যানিশ ভাষায়।

সেরা পদ্ধতিসমূহ