Better I18NОб этом шаблоне
Это шаблон-стартер, демонстрирующий, как использовать better-i18n с Next.js App Router для создания многоязычных приложений.
Технологический стек
Next.js 15
App Router + серверные компоненты
@better-i18n/next
Переводы на CDN
next-intl
Типобезопасные хуки переводов
Tailwind CSS 4
Стилизация с помощью утилит
TypeScript 5
Полная типобезопасность
Архитектура CDN-переводов
Узнать большеbetter-i18n использует архитектуру CDN-first. При публикации переводов в панели управления они разворачиваются на глобальной сети Cloudflare с задержкой менее 50ms по всему миру.
Публикация из панели управления
Переводы публикуются из панели управления better-i18n в хранилище Cloudflare R2.
Доставка через Edge CDN
Пакеты переводов обслуживаются с глобальных edge-узлов со временем загрузки менее 50ms.
Серверный рендеринг
Серверные компоненты Next.js получают переводы во время запроса через getMessages() для SEO-оптимизированного HTML.
Гидрация клиента
BetterI18nProvider гидрирует переводы на стороне клиента без сдвига макета. useSetLocale() обеспечивает мгновенное переключение.
SDK кэширует данные манифеста на 5 минут и сообщения переводов на 30 секунд по умолчанию. Инвалидация кэша происходит автоматически при публикации.
API SDK, используемые в этом шаблоне
Полный справочник API| API | Тип | Назначение |
|---|---|---|
createI18n() | Config | Инициализация SDK с настройками проекта |
i18n.betterMiddleware() | Server | Определение локали из URL, куки или Accept-Language |
i18n.getMessages(locale) | Server | Загрузка всех переводов для локали |
i18n.getLocales() | Server | Получение доступных локалей из CDN |
BetterI18nProvider | Client | React-контекст для переводов |
useTranslations(ns) | Client | Типобезопасный доступ к переводам |
useSetLocale() | Client | Мгновенное переключение языка |
useManifestLanguages() | Client | Динамическое обнаружение языков из CDN |
Как это работает
Переводы управляются в панели better-i18n и доставляются через CDN. Мидлвар определяет локаль пользователя из URL, cookie или языка браузера. Сообщения загружаются на сервере и передаются в BetterI18nProvider для клиентских компонентов.
Доступные локали
Эти локали загружаются из CDN во время сборки через серверный API i18n.getLocales().
Управляйте локалями из Панель управления better-i18n.