Най-доброто решение за интернационализация (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: Код на локал по подразбиране (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. Обърнете внимание, че само среди с разрешения read/write върху API ключа ще могат да създават нови низове за превод.

Препоръчваме да имате затворена и защитена staging среда, в която да тествате продукционното си приложение и да добавяте нови низове преди пускане в продукция. Това ще предотврати кражбата на вашия таен API ключ и потенциално раздуването на вашия проект за преводи чрез добавяне на злонамерени низове.