TacoTranslate
/
ДокументацияЦени
 
Статия
4 май

Най-доброто решение за интернационализация (i18n) в React приложенията

Търсите ли да разширите вашето React приложение към нови пазари? TacoTranslate прави локализацията на вашите React приложения изключително лесна, позволявайки ви да достигнете до глобална аудитория без никакви затруднения.

Защо да изберете TacoTranslate за React?

  • Безпроблемна интеграция: Специално създаден за React приложения, TacoTranslate се интегрира лесно във вашия съществуващ работен процес.
  • Автоматично събиране на низове: Без повече ръчно управление на JSON файлове. TacoTranslate автоматично събира низове от вашата кодова база.
  • Преводи с изкуствен интелект: Използвайте мощта на изкуствения интелект, за да осигурите контекстуално точни преводи, които съответстват на тона на вашето приложение.
  • Моментална езикова поддръжка: Добавете поддръжка за нови езици с един клик, правейки приложението си достъпно глобално.

Как работи

Инсталирайте пакета TacoTranslate чрез npm:

npm install tacotranslate

Когато модулът е инсталиран, ще трябва да създадете акаунт в TacoTranslate, проект за превод и съответните API ключове. Създайте акаунт тук. Това е безплатно и не изисква добавяне на кредитна карта.

В интерфейса на приложението TacoTranslate създайте проект и отидете в раздела с API ключове. Създайте един read ключ и един read/write ключ. Ще ги запазим като променливи на средата. read ключът е това, което наричаме public, а read/write ключът е secret. Например, можете да ги добавите във файл .env в корена на вашия проект.

Също така ще трябва да добавите още две променливи на средата: TACOTRANSLATE_DEFAULT_LOCALE и TACOTRANSLATE_ORIGIN.

  • TACOTRANSLATE_DEFAULT_LOCALE: Кодът на езика по подразбиране за резервиране. В този пример ще го зададем на en за английски.
  • TACOTRANSLATE_ORIGIN: „Папката“, в която ще се съхраняват вашите низове, например URL адресът на вашия уебсайт. Прочетете повече за origins тук.
.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 context provider:

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

  • Спестява време: Автоматизира досадния процес на локализация и събиране на стрингове, спестявайки ви ценно време.
  • Икономична опция: Намалява нуждата от ръчни преводи, като понижава разходите за локализация.
  • Подобрена точност: Преводите с AI гарантират контекстуално точни и висококачествени резултати.
  • Разгъващо се решение: Лесно добавяйте поддръжка за нови езици с растежа на вашето приложение и клиентска база.

Започнете още днес!

Вашето React приложение ще бъде преведено автоматично, когато добавите някакви низове към Translate компонента. Обърнете внимание, че само среди с права read/write върху API ключа ще могат да създават нови низове за превод.

Препоръчваме да имате затворена и защитена тестова среда, където да тествате вашето продукционно приложение, като добавяте нови низове преди да го пуснете на живо. Това ще предотврати кражбата на вашия таен 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Произведено в Норвегия