Интернет-магазин
«Авента»
Интернет-магазин с админ-панелью, лендинг и личный кабинет программы лояльности — от идеи и дизайна до высоконагруженного бэкенда и запуска.
Коротко о проекте
Next.js + NestJS
Единый TypeScript-стек: быстрый фронтенд на Next.js и надёжный API на NestJS.
Серверный рендеринг
SSR обеспечивает мгновенную загрузку страниц и отличное SEO для каталога.
15
серверов
Микросервисная архитектура, которая масштабируется под любые нагрузки.
Блок 01
Задача
Клиент — растущий ритейлер — пришёл со старым интернет-магазином, у которого накопилось множество проблем. Устаревший дизайн, некачественный код и постоянные баги, низкая конверсия, непонятный интерфейс, долгая загрузка и регулярные падения. Не было даже интеграции с программой лояльности.
Нужно было полностью переосмыслить платформу: ускорить, стабилизировать, сделать удобной и подготовить к росту. Мы решили все эти проблемы.
Цель: увеличить конверсию, обеспечить стабильность и подготовить магазин к масштабированию.
Устаревший дизайн
Интерфейс морально устарел, а запутанная навигация и низкая конверсия отпугивали покупателей.
Некачественный код и баги
Легаси-кодовая база порождала постоянные ошибки: корзина ломалась, заказы терялись, формы не отправлялись.
Долгая загрузка
Каталог из тысяч товаров открывался по несколько секунд, из-за чего пользователи уходили ещё до покупки.
Падения и нет лояльности
На пике нагрузки сайт падал, а интеграции с программой лояльности не было — постоянные клиенты не получали скидок.
Подход
Скорость, ясность и гибкая архитектура
PWA
офлайн
SSR
SEO
API
гибкость
Блок 02
Решение
Мы собрали платформу заново на современном стеке. Каждое решение подчинялось трём принципам: быстро, понятно и готово к росту.
- Полный редизайн каталога и карточки товара с фокусом на конверсию
- Mobile-first подход — идеальный опыт на любом устройстве
- Server-side рендеринг и кэширование для мгновенной загрузки
- Безопасная оплата и защита пользовательских данных
Блок 03
Команда и цифры
Над проектом работала кросс-функциональная команда: дизайн, фронтенд, бэкенд, DevOps и QA. Вот масштаб работы в цифрах.
Срок реализации
0
месяцев разработки
От исследования и прототипов до запуска и поддержки на проде.
0
специалистов в команде
0
микросервисов в архитектуре
0
двухнедельных спринтов
0.0K
коммитов в репозитории
0%
покрытие автотестами
Стек · Блок 04
Фронтенд
Компонентная архитектура на Next.js с серверным рендерингом каталога, кэшированием данных через SWR и глобальным состоянием на Zustand.
Next.js
SSR и маршрутизация
TypeScript
типобезопасность
Tailwind CSS
дизайн-система
SWR
данные и кэширование
Библиотека для загрузки данных по стратегии stale-while-revalidate: интерфейс мгновенно показывает данные из кэша и параллельно обновляет их в фоне. Автоматически перезапрашивает при фокусе окна и восстановлении сети, дедуплицирует запросы и держит каталог и корзину всегда актуальными без ручного управления состоянием.
Zustand
глобальное состояние
Лёгкий стор для клиентского состояния без бойлерплейта Redux. Хранит корзину, фильтры и данные пользователя, обновляется точечно и не вызывает лишних ре-рендеров. Простой API, крохотный размер бандла и отличная производительность даже на страницах с тысячами товаров.
Панель администратора · Блок 05
Собственная панель администратора
Мы разработали свою админ-панель, которая позволяет управлять всем сайтом — от перевода в технический режим до публикации статей, новостей, акций и работы с товарными подборками.
Технический режим
Одним переключателем сайт уходит на техническое обслуживание — с аккуратной заглушкой для посетителей.
Статьи и новости
Встроенный редактор позволяет писать и публиковать статьи, новости и обновления без разработчиков.
Акции
Создание и запуск акций и промо-кампаний с гибкими условиями — прямо из панели администратора.
Товарные подборки
Формирование кураторских подборок и коллекций товаров с drag-and-drop и мгновенной публикацией.
Программа лояльности · Блок 06
Своя программа лояльности
Мы разработали лендинг программы лояльности и полноценный личный кабинет с возможностью выводить бонусы на карту и получать персональные скидки.
Личный кабинет
Держатели карты видят баланс бонусов, историю начислений и персональные скидки в одном месте.
Вывод бонусов на карту
Накопленные бонусы можно вывести прямо на банковскую карту в пару кликов — без обращения в поддержку.
Эксклюзивные условия
Участники программы получают персональные цены и особые условия, недоступные обычным покупателям.
Эксклюзивные акции
Закрытые распродажи и промо-кампании только для держателей карты лояльности.
Лендинг программы
Отдельная посадочная страница объясняет преимущества и приводит новых участников в программу.
Стек · Блок 07
Бэкенд
Модульный сервис на NestJS с базой MySQL, контейнеризацией через Docker и горизонтальным масштабированием за Nginx.
NestJS
модульное ядро сервиса
MySQL
основная база данных
Docker
контейнеризация
Nginx
прокси и балансировка
Микросервисы
15 независимых сервисов: каталог, заказы, оплата, лояльность, поиск и уведомления — масштабируются и обновляются раздельно.
Интеграция · Блок 08
Интеграция с 1С
Сайт полностью завязан на 1С: она — единый источник данных. Товары, остатки, цены и фото приходят из 1С, а оформленные заказы уходят обратно в неё для обработки.
1С → Сайт
Товары
Полная номенклатура с характеристиками и категориями.
Остатки
Актуальное наличие по складам в реальном времени.
Цены
Базовые и персональные цены синхронизируются автоматически.
Фото товаров
Изображения карточек подтягиваются напрямую из 1С.
Описания
Тексты, свойства и сопутствующая информация о товарах.
1С
единый источник
Полная двусторонняя синхронизация в реальном времени
Сайт → 1С
Заказы
Каждый оформленный заказ мгновенно уходит в 1С для обработки, резервирования остатков и дальнейшей логистики.
Оформление заказа, остатки и цены полностью завязаны на 1С — данные на сайте и в учётной системе всегда синхронны.
Поисковый движок · Блок 09
OpenSearch
Мы внедрили и поддержали OpenSearch — сложный распределённый поисковый движок, который отвечает за молниеносный поиск, автодополнение и фасетную фильтрацию по всему каталогу.
Мгновенный поиск
Автодополнение и подсказки с исправлением опечаток по каталогу из тысяч SKU.
Фасетная фильтрация
Фильтры по цене, бренду, характеристикам и наличию агрегируются на лету.
Отклик до 50 мс
Инвертированные индексы отдают релевантную выдачу даже под высокой нагрузкой.
Управление релевантностью
Бустинг, синонимы и аналитика запросов настраиваются через дашборд.
И это ещё не всё · Блок 10
Всю проделанную работу невозможно уместить в один кейс
Поэтому коротко — об использованных API, интеграциях и функциях, которые остались за кадром, но составляют значимую часть платформы.
API и интеграции
VK API
Авторизация пользователей через ВКонтакте.
CDEK · Boxberry · Деловые линии
Доставка и расчёт стоимости в реальном времени по нескольким службам.
CKEditor
Локальная установка редактора прямо в проект — без внешних зависимостей.
Конфигураторы ArLight и Raec
Подбор и конфигурация оборудования по параметрам поставщиков.
Плотная интеграция с Raec
Цены, сертификаты, описания и другая информация о товарах.
SMS Center
Отправка SMS-уведомлений и кодов подтверждения.
SMTP
Кастомные корпоративные письма и почтовые рассылки.
API программы лояльности
Соединили с основным сайтом для получения персональных цен.
Калькуляторы
Калькулятор ArLight
Расчёт под задачи каталога ArLight.
Сечение кабеля
Подбор нужного сечения по нагрузке.
Ток нагрузки
Расчёт тока нагрузки для проектов.
Заполняемость кабель-канала
Проверка вместимости кабель-канала.
Что ещё реализовано
Авторизация
Единая система входа, в том числе через VK.
Работа с брендами
Отдельная система управления брендами и их витринами.
Система смет
Гибко добавляйте товары, делитесь сметой, печатайте и конвертируйте в PDF.
Две раздельные корзины
Отдельно для товаров в наличии и тех, которых сейчас нет.
Умные подборки
Персональные товарные подборки под интересы покупателя.
«Вы смотрели»
Блок с недавно просмотренными товарами.
Вакансии
Раздел с вакансиями компании прямо на сайте.
Персональные цены
Программа лояльности связана с сайтом для индивидуальных цен.
Блок 11
Результат
Новая «Авента» загружается почти мгновенно, легко держит нагрузку и приносит клиенту больше заказов каждый месяц.
0.0 с
Средняя загрузка страницы
0K+
Товаров в каталоге
0+
Посетителей в месяц уже на запуске