Интернет-магазин Урал Групп

ООО «Урал Групп» из Перми с 2006 года поставляет ЖБИ и строительные материалы. У компании собственное производство бетонных изделий и доставка по Перми и краю. Было два устаревших сайта, их нужно было заменить одним современным сайтом-каталогом.

Онлайн-оплаты на сайте нет, продажи идут через заявки. Покупатель находит изделие, собирает корзину-заявку или оставляет форму, менеджер перезванивает и уточняет цену, наличие, объём и доставку. Отсюда главные требования. Нужную позицию должно быть легко найти, хотя изделия отличаются марками, сериями и типоразмерами. Заявки со всех форм должны доходить до менеджеров с составом корзины и страницей отправки. Сотрудники должны сами вести товары, страницы, акции и контакты, без разработчика. Сайт должен быть удобен с телефона.

Дизайн подготовил заказчик. Мы отвечали за серверную часть, сайт, админ-панель, перенос каталога и инфраструктуру.

Перенос и нормализация каталога

Каталог перенесли со старого сайта вместе с фотографиями. Сырые данные для фильтров не годились: 108 характеристик, из них 86 строковых, дубли вида «Размер» и «Размеры», разное написание марок, длина в метрах при значениях в миллиметрах, размеры и объём только в названии товара. Скрипт нормализации свёл их к 39 фильтруемым характеристикам и дозаполнил длину, ширину, высоту и объём из названий. Фото скачиваются в собственное хранилище S3, одинаковые файлы не дублируются. Все скрипты можно запускать повторно и в пробном режиме, поэтому каталог обновляется из новой выгрузки без ручной чистки.

Фильтры, свои для каждой категории

У бордюра, фанеры и сваи разные характеристики, и жёсткие колонки в таблице товаров пришлось бы менять под каждую новую категорию. Поэтому характеристики хранятся в гибкой типизированной схеме, а фильтр включается для пары категории и характеристики: «Марка» может быть фильтром в кирпиче и не быть в ЖБИ. Для родительских разделов фильтры собираются по всей ветке, у каждого варианта показано число товаров. Состояние фильтров хранится в адресе страницы, поэтому ссылку на подборку можно переслать. Позиции с ценой по запросу не попадают в фильтр по цене и не ломают сортировку.

Поиск без отдельного поискового сервера

Поиск работает на PostgreSQL, и отдельный Elasticsearch клиенту содержать не нужно. Он устроен в три слоя. Полнотекстовый поиск, где название и артикул важнее описания. Поиск части слова, когда «бетон» находит «газобетонный». Нечёткий поиск по триграммам для опечаток, когда «цимент» находит «Цемент М500». Порог похожести подобрали на реальных названиях товаров. Если ничего не нашлось, посетитель отправляет запрос на подбор с текстом и файлами, и менеджер получает его вместе с поисковой фразой.

Заявки, которые не теряются

Все формы сайта сводятся к одной сущности заявки. Запись о доставке создаётся в той же транзакции, что и заявка, а фоновый обработчик отправляет письмо и сообщения в Telegram с повторными попытками. Если почтовый сервис недоступен, заявка дождётся отправки. Состав корзины сохраняется на момент заявки, поэтому заявка не меняется, если товар подорожал или удалён. Права сотрудника проверяются в момент отправки: если роль сняли, контакты клиента ему уже не уйдут. От спама защищает ограничение частоты запросов, файлы к заявке проверяются по белому списку типов.

Визуальный конструктор страниц

Страницы собираются из 24 типов блоков: тексты, карточки, цифры, вопросы и ответы, шаги, товары, акции, партнёры, отзывы, формы. Админка открывает сайт в окне редактора, текст правится прямо на странице, блоки перетаскиваются, действия можно отменить и повторить. Черновик показывают руководству по защищённой ссылке с ограниченным сроком действия, публикация отделена от черновика. В том же конструкторе собирается раздел реализованных проектов.

Админ-панель и инфраструктура

В админ-панели две роли: администратор и менеджер. Сотрудники ведут дерево категорий, товары с характеристиками и SEO-полями, акции, партнёров, страницы, контакты и заявки со статусами и ответственным. Правки из админки появляются на сайте в течение минуты без нового развёртывания.

Сайт, админка и API работают в Kubernetes. Сборку выполняет GitLab CI, а Argo CD синхронизирует кластер с репозиторием, так что состояние сервера всегда совпадает с кодом. Секреты хранятся в зашифрованном виде, сертификаты выпускаются автоматически. Перед сдачей админку проверили исследовательским тестированием и по его итогам доработали проверку форм, проверку загружаемых картинок и защиту от потери несохранённых правок.

Новый сайт работает на домене компании. Каталог перенесён и приведён к единому виду: более 1 600 товаров, фильтры в 84 категориях. Заявки со всех форм уходят менеджерам на почту и в Telegram вместе с составом корзины, а в админке у каждой заявки есть история статусов.

Компания сама обновляет товары, страницы, акции, контакты и SEO-поля. Сверх первого этапа по техническому заданию сделаны расширенные фильтры, избранное, раздел проектов, визуальный конструктор страниц и заявка на подбор товара. Для второго этапа заложены интеграции с Битрикс24 и 1С без переделки приёма заявок.

Технологии: NestJS, TypeORM, PostgreSQL, Redis, S3, Next.js 16, React, Tailwind CSS, HeroUI, Docker, Kubernetes, Argo CD, GitLab CI.