TacoTranslate
/
Баримт бичигҮнийн мэдээлэл
 
Нийтлэл
5-р сарын 04

React аппуудад олон улсынчлал (i18n) хийх хамгийн сайн шийдэл

React аппликейшнаа шинэ зах зээл рүү тэлэхийг хүсэж байна уу? TacoTranslate нь таны React аппликейшнүүдийг локалчлахыг үнэхээр хялбар болгодог бөгөөд ингэснээр та төвөггүйгээр дэлхийн хэмжээнд хэрэглэгчдэд хүрч чадна.

React-д зориулсан TacoTranslate-ыг яагаад сонгох вэ?

  • Гөлгөр нэгтгэл: React програмуудад зориулан бүтээгдсэн бөгөөд TacoTranslate таны одоогийн ажлын урсгалд саадгүй нэгдэнэ.
  • Текстийн автомат цуглуулалт: JSON файлуудыг гараар удирдах шаардлагагүй. TacoTranslate таны кодын сангаас текстүүдийг автоматаар цуглуулна.
  • Хиймэл оюун ухаанд суурилсан орчуулга: Хиймэл оюун ухааны хүчийг ашиглан таны програмын өнгө аясад тохирсон, контекстэд нийцсэн нарийвчилсан орчуулгыг өгнө.
  • Хурдан хэлний дэмжлэг: Зөвхөн нэг товшилтоор шинэ хэлүүдийн дэмжлэгийг нэмж, таны програмыг дэлхий даяар хүртээмжтэй болгоно.

Яаж ажилдаг вэ

TacoTranslate багцыг npm-аар суулгах:

npm install tacotranslate

Модулийг суулгасны дараа TacoTranslate данс, орчуулгын төсөл болон холбогдох API түлхүүрүүдийг үүсгэх шаардлагатай. Энд бүртгэл үүсгээрэй. Үнэгүй бөгөөд кредит карт оруулах шаардлагагүй.

TacoTranslate програмын UI-д төслийг үүсгээд API keys таб руу шилжээрэй. Нэг read түлхүүр болон нэг read/write түлхүүр үүсгээрэй. Эдгээрийг орчны хувьсагчид (environment variables) болгон хадгална. read түлхүүрийг бид public гэж нэрлэдэг бөгөөд read/write түлхүүрийг secret гэж нэрлэдэг. Жишээлбэл, та тэдгээрийг төслийн үндсэн хавтасанд байгаа .env файлыгд нэмэж болно.

Мөн та дараах хоёр орчны хувьсагчийг нэмэх хэрэгтэй: TACOTRANSLATE_DEFAULT_LOCALE ба TACOTRANSLATE_ORIGIN.

  • TACOTRANSLATE_DEFAULT_LOCALE: Анхдагч (fallback) буцах хэлний код. Энэ жишээнд бид үүнийг en гэж Англи хэлний хувьд тохируулна.
  • TACOTRANSLATE_ORIGIN: Таны мөрүүд хадгалагдах “фолдер” буюу газар, жишээ нь таны вэбсайтын URL. Энд эх үүсвэрийн тухай дэлгэрэнгүй уншина уу.
.env
TACOTRANSLATE_PUBLIC_API_KEY=123456
TACOTRANSLATE_SECRET_API_KEY=789010
TACOTRANSLATE_DEFAULT_LOCALE=en
TACOTRANSLATE_ORIGIN=your-website-url.com

Нууц read/write API түлхүүрийг клиент талын үйлдвэрлэлийн орчинд хэзээ ч ил гаргахгүй байхыг баталгаажуулна уу.

TacoTranslate-ийг тохируулах

TacoTranslate-ийг React програмдаа тохируулж эхлэхийн тулд програмыг TacoTranslate контекст провайдерээр орооно:

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

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

export default function App() {
	const [locale, setLocale] = useState('en');

	return (
		<TacoTranslate client={tacoTranslate} locale={locale}>
			<Translate string="Hello, world!"/>
		</TacoTranslate>
	);
}

Одоо та програмынхаа аль ч газарт Translate компонент ашиглан орчуулсан текстийг харуулж болно! Илүү олон мэдээлэл болон таны тохиргоонд зориулагдсан хэрэгжүүлэх зааварчилгааг авахын тулд манай баримт бичгийг заавал шалгаарай.

import {Translate} from 'tacotranslate/react';

export default async function Component() {
	return (
		<Translate string="Hello? This is TacoTranslate speaking." />
	);
}

TacoTranslate ашиглах давуу талууд

  • Цаг хэмнэх: Локалчлал ба текст мөрүүдийг цуглуулах уйтгартай процессыг автоматжуулж, таны үнэт цагийг хэмнэнэ.
  • Зардал хэмнэх: Гараар орчуулах шаардлагыг багасгаж, локалчлалын зардлыг бууруулна.
  • Нарийвчлал сайжирсан: Хиймэл оюун ухаанаар ажилладаг орчуулга нь контекстэд нийцсэн, өндөр чанартай үр дүнг хангана.
  • Тэлж чаддаг шийдэл: Аппликейшн болон хэрэглэгчийн бааз нэмэгдэх тусам шинэ хэлүүдийн дэмжлэгийг хялбархан нэмэх боломжтой.

Өнөөдөр эхлээрэй!

Таны React аппликейшн Translate компонент руу ямар нэгэн тэмдэгт мөр нэмсэн тохиолдолд автоматаар орчуулагдана. API түлхүүр дээр read/write эрхтэй орчин л шинэ орчуулах тэмдэгт мөр үүсгэх боломжтой гэдгийг анхаарна уу.

Бид таны продакшн аппликейшныг турших, шинэ тэмдэгт мөрүүдийг нэвтрүүлэхээс өмнө нэмэх зориулалттай хаалттай, хамгаалалттай staging орчинтой байхыг зөвлөж байна. Энэ нь хэн нэгэнд таны нууц API түлхүүрийг хулгайлах болон дур зоргоор нэмсэн тэмдэгт мөрүүдээр орчуулгын төслийг хэт ихээр тэлэгдэхээс сэргийлнэ.

Be sure to check out the complete examples over at our GitHub profile. If you encounter any problems, feel free to reach out, and we’ll be more than happy to help.

TacoTranslate lets you automatically localize your React applications quickly to and from over 75 languages. Translate for free!

Nattskiftet-аас гаралтай бүтээгдэхүүнНорвегид үйлдвэрлэсэн