Интернационализация

Добавьте поддержку нескольких языков в своё приложение. Используйте Proyecta Content API для локализации редакционного контента или попросите AI подключить i18n-фреймворк прямо в коде.

Proyecta поддерживает два взаимодополняющих подхода к интернационализации создаваемых приложений:

1. Локализация контента через Proyecta Content API — для редакционного контента (публикации в блоге, FAQ, маркетинговые тексты), который нужно перевести на несколько языков
2. i18n на уровне кода через фреймворк переводов — для строк интерфейса, дат, валют и переключения локали во время выполнения

Оба подхода работают уже сейчас. Выбор зависит от того, что именно вы переводите.

Сам Proyecta Builder поставляется с поддержкой 24 локалей — продукт прекрасно разбирается в i18n. Те же паттерны применимы и к приложениям, которые вы создаёте в нём.

Вариант 1: Локализация контента (Proyecta Content API)

Если вы создаёте сайт с большим количеством контента — блог, базу знаний, маркетинговые страницы, каталог товаров — используйте встроенную поддержку локалей. Скажите AI, какие языки вы поддерживаете ("Make the site available in English, Spanish and French"), и он зарегистрирует их за вас, сделав английский языком по умолчанию. После этого запрашивайте контент на языке посетителя.

На frontend типизированные хуки контента в шаблоне автоматически подставляют локализованные поля — передайте активную локаль посетителя, и каждое поле с типом localized вернётся уже в виде одного переведённого значения:

import { useCollection, useEntry } from '@/hooks/useContent';
import { useTranslation } from 'react-i18next';

function Blog({ slug }: { slug: string }) {
    const { i18n } = useTranslation();

    // List a collection in the current locale
    const { data: posts } = useCollection('posts', { locale: i18n.language });

    // Or read one entry by slug in the current locale
    const { data: post } = useEntry('posts', slug, { locale: i18n.language });

    // ...render posts / post
}

Под капотом CMS проходит цепочку запасных локалей: запрошенная локаль → настроенные запасные локали → локаль по умолчанию — и сообщает фактически использованный код в поле localeResolved каждой записи. Если не передавать locale на одноязычных сайтах, поля возвращаются как обычные значения.

Этот вариант подходит, когда:

• Редакторы без навыков программирования должны переводить контент
• Нужна версионность переводов
• Требуется публикация для отдельных локалей (отложенная публикация появится в ближайшее время — сейчас записи требуют ручной публикации через API)

Полное описание Content API см. в разделе Управление контентом.

Вариант 2: i18n-фреймворк на уровне кода

Для строк интерфейса — подписей, кнопок, сообщений об ошибках, дат, валют — попросите AI подключить i18n-фреймворк прямо в ваш проект:

Add internationalization to my app.
Support English, Spanish, French, and Arabic.
Add message catalogs in src/locales/.
Add a language switcher in the header.
Use locale-prefixed URLs like /en/about and /es/about.
Make sure RTL layout works correctly for Arabic.

AI выполнит следующее:

1. Выберет фреймворк — AI использует i18next с react-i18next (стандарт Proyecta)
2. Создаст файлы каталогов в src/locales/ (один JSON на каждый язык)
3. Обернёт тексты в вызовы t() (из хука useTranslation библиотеки react-i18next)
4. Добавит компонент переключения языка
5. Настроит URL-роутинг с префиксами локалей
6. Обработает RTL-раскладки (dir="rtl") для арабского, иврита и других языков
7. Отформатирует числа, даты и валюты согласно локали

Автоматический перевод с помощью AI

Как только базовый язык готов, AI отлично справляется с созданием остальных файлов каталогов:

• "Переведи все строки из src/locales/en.json на испанский, французский, немецкий и японский. Используй естественные, идиоматичные формулировки — названия брендов не переводи."
• "Моё приложение полностью написано по-английски. Добавь испанские переводы для всего и префикс маршрута es/."

Для критически важного контента (юридические тексты, медицина, финансы) перед публикацией попросите профессионального переводчика проверить результат работы AI.

Совместное использование обоих подходов

В большинстве реальных приложений используются оба подхода: i18n на уровне кода — для элементов интерфейса (кнопки, ошибки, навигация), а Content API — для редакционного контента (статьи, описания товаров). Они прекрасно сосуществуют: ваш i18n-фреймворк обрабатывает файлы каталогов во время сборки, а Content API отдаёт локализованные записи во время выполнения.

Рекомендации

1. Сначала выберите базовый язык и зафиксируйте тексты. Переводить постоянно меняющийся контент — настоящая боль.
2. Переводите партиями. Не переводите по ходу работы — дождитесь, пока функция стабилизируется.
3. Тестируйте RTL как можно раньше, если поддерживаете арабский или иврит. RTL-баги незаметны, пока вы не посмотрите специально.
4. Добавляйте lang и dir на <html>. Браузеры и скринридеры зависят от этих атрибутов.
5. Используйте Intl для форматирования. Не изобретайте велосипед для форматирования дат и валют — используйте Intl.DateTimeFormat, Intl.NumberFormat.

Скоро появится

• UI управления локалями прямо в Builder — выбирайте локали, отслеживайте охват переводов, редактируйте каталоги, не покидая Proyecta
• Автоматический перевод при сохранении новых строк
• Шаблоны проектов с готовой i18n-конфигурацией с предустановленным фреймворком