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 অনুবাদ তৈরি করতে একটি অ্যাসিঙ্ক্রোনাস অনুবাদ কাজ শুরু করি। AI অনুবাদ প্রস্তুত হলে, এটি মেশিন অনুবাদের স্থান নেবে এবং যখনই আপনি আপনার স্ট্রিংগুলোর অনুবাদ অনুরোধ করবেন তখন এটি পাঠানো হবে।
যদি আপনি কোনো স্ট্রিং ম্যানুয়ালি অনুবাদ করে থাকেন, তবে সেই অনুবাদগুলো অগ্রাধিকার পাবে এবং সেগুলোই ফেরত পাঠানো হবে।
উৎস ব্যবহার
TacoTranslate প্রকল্পগুলোতে এমন কিছু থাকে যা আমরা উৎস বলি। এগুলোকে আপনার স্ট্রিং এবং অনুবাদগুলির জন্য এন্ট্রি পয়েন্ট, ফোল্ডার বা গ্রুপ হিসেবে বিবেচনা করুন।
import {TacoTranslate} from 'tacotranslate/react';
function Menu() {
return (
<TacoTranslate origin="application-menu">
// ...
</TacoTranslate>
);
}উৎসগুলো আপনাকে স্ট্রিংগুলোকে অর্থবহ কন্টেইনারে আলাদা করে রাখতে দেয়। উদাহরণস্বরূপ, আপনার ডকুমেন্টেশনের জন্য একটি উৎস থাকতে পারে এবং আপনার মার্কেটিং পেজের জন্য আরেকটি।
আরও সূক্ষ্ম নিয়ন্ত্রণের জন্য, আপনি কম্পোনেন্ট স্তরে origins সেট আপ করতে পারেন।
এটি অর্জন করতে, বিবেচনা করুন একাধিক TacoTranslate প্রদানকারী ব্যবহার করা আপনার প্রকল্পে।
দয়া করে লক্ষ্য করুন যে একই স্ট্রিংটি বিভিন্ন উত্সে ভিন্ন অনুবাদ পেতে পারে।
অবশেষে, স্ট্রিংগুলোকে কীভাবে origins-এ ভাগ করবেন তা আপনার এবং আপনার প্রয়োজনের ওপর নির্ভর করে। তবে লক্ষ্য করুন, একই origin-এ অনেক স্ট্রিং থাকলে লোডিং সময় বেড়ে যেতে পারে।
ভেরিয়েবল পরিচালনা
ডাইনামিক কনটেন্টের জন্য—যেমন ব্যবহারকারীর নাম, তারিখ, ই-মেইল ঠিকানা ইত্যাদি—সবসময় ভ্যারিয়েবল ব্যবহার করা উচিত।
স্ট্রিংগুলিতে ভেরিয়েবলগুলি ডাবল ব্র্যাকেট ব্যবহার করে ঘোষণা করা হয়, যেমন {{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}
/>
);
}উপরের উদাহরণটি সাধারণ টেক্সট হিসেবে প্রদর্শিত হবে।