Беспрепятственная локализация для 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 вашего сайта. Подробнее о происхождении здесь.

.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-ключа.

Мы рекомендуем иметь закрытую и защищённую тестовую среду, где вы можете тестировать ваше production-приложение, добавляя новые строки перед запуском. Это предотвратит кражу вашего секретного API-ключа и возможное раздувание вашего проекта перевода из-за добавления нежелательных строк.