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

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

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

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

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

Как работи

Инсталирайте пакета 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 контекстния доставчик:

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. Обърнете внимание, че само среди с разрешения 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Произведено в Норвегия