TacoTranslate ব্যবহার
স্ট্রিংগুলো অনুবাদ করা
বর্তমানে স্ট্রিংগুলো অনুবাদ করার তিনটি উপায় আছে: Translate কম্পোনেন্ট, useTranslation হুক, অথবা translateEntries ইউটিলিটি।
Translate কম্পোনেন্ট ব্যবহার করা।
অনুবাদগুলোকে span উপাদানের ভিতরে আউটপুট করে এবং HTML রেন্ডারিং সমর্থন করে।
import {Translate} from 'tacotranslate/react';
function Page() {
return <Translate string="Hello, world!" />;
}আপনি, উদাহরণস্বরূপ, কম্পোনেন্টে as="p" ব্যবহার করে উপাদানের ধরন পরিবর্তন করতে পারেন।
useTranslation হুক ব্যবহার করা।
অনুবাদগুলো একটি সাধারণ স্ট্রিং হিসেবে ফেরত দেয়। উদাহরণস্বরূপ, meta ট্যাগগুলোতে এটি উপকারী।
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 ইউটিলিটি ব্যবহার করা।
সার্ভার সাইডে স্ট্রিংগুলো অনুবাদ করুন। আপনার OpenGraph ইমেজগুলোকে সুপারচার্জ করুন।
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)
};
}স্ট্রিংগুলো কীভাবে অনুবাদ করা হয়
যখন স্ট্রিংগুলো আমাদের সার্ভারে পৌঁছে, আমরা প্রথমে সেগুলো যাচাই করে সংরক্ষণ করি, এবং সঙ্গে সঙ্গেই একটি মেশিন অনুবাদ ফেরত দিই। মেশিন অনুবাদ সাধারণত আমাদের এআই অনুবাদের তুলনায় মানগতভাবে নীচে হলেও, সেগুলো দ্রুত একটি প্রাথমিক প্রতিক্রিয়া প্রদান করে।
একই সঙ্গে, আমরা আপনার স্ট্রিংটির জন্য উচ্চমানের, সর্বাধুনিক AI অনুবাদ তৈরির উদ্দেশ্যে একটি অ্যাসিঙ্ক্রোনাস অনুবাদ কাজ শুরু করি। যখন AI অনুবাদ প্রস্তুত হবে, এটি মেশিন অনুবাদকে প্রতিস্থাপন করবে এবং যখনই আপনি আপনার স্ট্রিংগুলোর অনুবাদ অনুরোধ করবেন তখন তা পাঠানো হবে।
যদি আপনি কোনো স্ট্রিং ম্যানুয়ালি অনুবাদ করে থাকেন, তবে সেই অনুবাদগুলোই প্রাধান্য পাবে এবং সেগুলোই ফেরত দেওয়া হবে।
অরিজিন ব্যবহার করা
TacoTranslate প্রকল্পগুলোতে আমরা যাকে উৎস বলি তা থাকে। এগুলোকে আপনার স্ট্রিংগুলো ও অনুবাদগুলোর জন্য প্রবেশ পয়েন্ট, ফোল্ডার বা গ্রুপ হিসেবে ভাবুন।
import {TacoTranslate} from 'tacotranslate/react';
function Menu() {
return (
<TacoTranslate origin="application-menu">
// ...
</TacoTranslate>
);
}Origins আপনাকে স্ট্রিংগুলোকে অর্থবহ কনটেইনারে আলাদা করতে দেয়। উদাহরণস্বরূপ, ডকুমেন্টেশনের জন্য একটি অরিজিন এবং আপনার মার্কেটিং পেজের জন্য আরেকটি থাকতে পারে।
আরও সূক্ষ্ম নিয়ন্ত্রণের জন্য, আপনি কম্পোনেন্ট স্তরে origins সেট আপ করতে পারেন।
এটি অর্জন করতে, আপনার প্রকল্পে একাধিক TacoTranslate প্রদানকারী ব্যবহার করার কথা বিবেচনা করুন।
অনুগ্রহ করে লক্ষ্য করুন যে একই স্ট্রিং বিভিন্ন উৎসে ভিন্ন অনুবাদ পেতে পারে।
অবশেষে, আপনি স্ট্রিংগুলো কীভাবে উৎসগুলিতে ভাগ করবেন তা আপনার এবং আপনার চাহিদার ওপর নির্ভর করে। তবে লক্ষ্য করুন যে একই উৎসে অনেক স্ট্রিং থাকলে লোডিং সময় বাড়তে পারে।
ভেরিয়েবলগুলো পরিচালনা
গতিশীল বিষয়বস্তুর জন্য, যেমন ব্যবহারকারীর নাম, তারিখ, ইমেইল ঠিকানা ইত্যাদি, সবসময় ভেরিয়েবল ব্যবহার করা উচিত।
স্ট্রিং-এ ভেরিয়েবলগুলো ডাবল ব্র্যাকেট ব্যবহার করে ঘোষণা করা হয়, যেমন {{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 বিষয়বস্তু পরিচালনা
ডিফল্টভাবে, Translate কম্পোনেন্ট HTML বিষয়বস্তু সমর্থন করে এবং রেন্ডার করে। তবে, আপনি এই আচরণ থেকে অপট-আউট করতে পারেন useDangerouslySetInnerHTML কে false সেট করে।
ব্যবহারকারী-সৃষ্ট কনটেন্টের মতো অবিশ্বস্ত সামগ্রী অনুবাদ করার সময় HTML রেন্ডারিং নিষ্ক্রিয় করা দৃঢ়ভাবে সুপারিশ করা হয়।
সমস্ত আউটপুট রেন্ডার হওয়ার আগে সবসময় sanitize-html দ্বারা স্যানিটাইজ করা হয়।
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}
/>
);
}উপরে দেওয়া উদাহরণটি সাধারণ টেক্সট হিসেবে প্রদর্শিত হবে।