3 языка на сайте за 1 день через vibe-coding
Контекст
Рынок агентства — не только русскоязычный: часть клиентов комфортнее читает украинский или английский. Долгие переводы «потом» откладываются бесконечно, поэтому мы решили заложить мультиязычность в первую версию лендинга и уложиться в короткий спринт. Ограничение было простым: без CMS на старте, тексты в репозитории, предсказуемые URL для SEO и рекламы.
Подход
Мы выбрали JSON-словари по локали и единый тип Dictionary в TypeScript, чтобы IDE подсказывала ключи и не было опечаток в продакшене. Структура страниц — сегмент [locale] в App Router, список локалей в config, проверка isLocale на входе. Для дефолтной русской версии URL без префикса /ru, для ua и en — префиксы в пути — это соответствует ожиданиям пользователей и упрощает шаринг ссылок.
Middleware решает две задачи: нормализует запросы без префикса к внутреннему ru и отдаёт заголовок с локалью для HTML-атрибута lang. Переключатель языка строит путь через helper localizedPath, чтобы не дублировать логику в кнопках.
Что ускорило «vibe-coding»
Во-первых, жёсткая дисциплина: один источник правды для текстов, без копипасты секций между файлами. Во-вторых, автоматизация рутины — генерация метаданных и sitemap из тех же локалей, чтобы не забыть альтернативные языки. В-третьих, согласованные компоненты: DictionaryProvider на клиенте для header и CTA, серверные страницы для SEO-текста.
Ограничения
Статичные JSON не подходят для частых правок без деплоя — для блога и контента мы добавляем MDX в репо, а для крупного редакционного процесса позже можно подключить CMS. Но для лендинга агентства связка «код + словари» оказалась быстрее, чем интеграция headless CMS на первом этапе.
Итог
Три языка за день — не про магию, а про заранее выбранные паттерны и отсутствие спорных абстракций. Следующий шаг — наполнить блог кейсами на всех локалях по мере готовности переводов.
Хотите такого же подхода к локализации? Забронируйте стратегический разбор — разберём ваш стек и приоритеты.
