Кейс - Система отчётности для мойки танк-контейнеров: Битрикс + Next.js + мобильное приложение

Переработали B2B-систему отчётности для мойки танк-контейнеров: вынесли фронтенд на Next.js (headless поверх 1С-Битрикс), разработали мобильное приложение на React Native и опубликовали в RuStore. Заявки через ЛК выросли на 30%, скорость обработки отчётов — на 40%.

Клиент
Год
Услуга

О клиенте: специализированная логистика для химической промышленности

ЛЕНХИМСИНТЕЗ — санкт-петербургская компания, специализирующаяся на профессиональной мойке и дегазации танк-контейнеров. Танк-контейнер — это специализированная ёмкость для перевозки жидких химических грузов: кислот, щелочей, растворителей, пищевых продуктов. После каждого цикла перевозки контейнер нуждается в тщательной очистке согласно международным стандартам — SQAS, EFTCO, ADR. Именно этим занимается ЛЕНХИМСИНТЕЗ.

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

С чего начали: сайт на 1С-Битрикс и первая версия системы отчётности

К моменту обращения у ЛЕНХИМСИНТЕЗ уже был рабочий сайт на 1С-Битрикс и самописная система отчётности, выросшая из стандартных модулей CMS. Первая версия решала задачу минимально: клиент заходил в личный кабинет, оставлял заявку, мойщик вручную обновлял статус, итоговый отчёт уходил по email.

Система работала — но ровно до тех пор, пока объёмы оставались небольшими. С ростом числа клиентов и партнёров накопились системные проблемы, которые больше нельзя было игнорировать. Компания оказалась перед выбором: дорабатывать монолит или строить что-то принципиально новое.

Проблема: когда 1С-Битрикс-монолит перестаёт справляться с ростом

Аудит выявил картину, типичную для зрелого B2B-бизнеса, выросшего из стандартного CMS-решения:

  • Медленный интерфейс. Стандартный PHP-рендеринг Битрикса давал время загрузки личного кабинета 4–6 секунд. Клиенты, работающие с планшетов на производственных площадках, регулярно теряли сессию — и бросали работу в ЛК в пользу звонка менеджеру.
  • Нет мобильного инструмента для мойщиков. Сотрудники не могли загрузить фотоотчёт прямо в процессе мойки — только через ПК в офисе. Email-отчёты терялись, путались, требовали двойного ввода данных.
  • Отсутствие real-time уведомлений. Клиент не знал, на каком этапе находится его заявка. Push-уведомлений не было вообще — только email, который проверяли раз в несколько часов.
  • Дорогое масштабирование. Добавление нового статуса заявки, нового типа отчёта или нового сценария для партнёра требовало правки PHP-шаблонов и модулей Битрикса — каждое изменение было долгим и рискованным.
  • Слепые пятна в аналитике. Руководство не видело реальной картины: сколько заявок в обработке, каковы средние сроки, где узкие места по конкретным терминалам.

Мы предложили headless-переход без потери существующей бизнес-логики: оставить 1С-Битрикс как надёжный бэкенд и движок бизнес-процессов, но полностью заменить фронтенд и добавить нативное мобильное приложение.

Наше решение: headless-архитектура плюс мобильное приложение для мойщиков

Концепция headless B2B-платформы: 1С-Битрикс остаётся «мозгом» системы — управляет бизнес-логикой, хранит данные, интегрируется с 1С — но фронтенд полностью выносится на Next.js. Такой подход — наша специализация: подробнее о том, как мы строим headless-решения на основе Битрикс-бэкенда, можно прочитать на странице FrontBox — headless Next.js + Elasticsearch.

Параллельно разработали мобильное приложение на React Native для мойщиков и выездного персонала. Почему React Native, а не PWA? Нам были необходимы нативные push-уведомления через FCM, доступ к камере для фотоотчётов в высоком качестве, офлайн-режим при нестабильном интернете на производственных площадках — и публикация в RuStore для корпоративного распространения без зависимости от зарубежных сервисов.

Трёхролевая система: единый ЛК для клиентов, мойщиков и партнёров

Главный вызов — три категории пользователей с принципиально разными сценариями работы, которые должны работать в единой экосистеме:

  • Клиенты (транспортные компании) — подают заявки на мойку контейнеров, прикладывают сопроводительные документы, отслеживают статус в реальном времени, получают готовые акты в PDF с электронной подписью.
  • Мойщики — принимают заявки в мобильном приложении, фотографируют контейнер до и после мойки, заполняют чеклист по стандарту EFTCO, подписывают акт выполненных работ прямо в приложении.
  • Партнёры-операторы терминалов — видят сводную картину по всем заявкам на своём терминале, управляют расписанием мойки, выгружают аналитику и сводные отчёты за любой период.

Архитектура решения: от Битрикс-монолита к headless-платформе

Бэкенд: 1С-Битрикс как API-сервер

Мы не стали «выбрасывать» существующий Битрикс — это была бы потеря нескольких лет накопленной бизнес-логики. Вместо этого превратили его в REST API-сервер: написали PHP-модуль, который экспонирует все необходимые методы — создание и обновление заявок, загрузка файлов, смена статусов, формирование отчётов — через защищённый API с JWT-авторизацией. Бизнес-логика сохранилась полностью, разработка заняла вдвое меньше времени, чем при написании бэкенда с нуля.

Это наш стандартный паттерн при работе с зрелыми Битрикс-проектами. Подробнее о подходе к интеграциям — на странице Интеграции.

Фронтенд: Next.js App Router с гибридным рендерингом SSR/SSG

Next.js с App Router позволил гибко управлять рендерингом под каждый тип страницы: публичные страницы — статические (SSG для моментальной загрузки и лучшего SEO), личный кабинет — серверный рендеринг (SSR) с гидратацией для корректной работы с авторизацией и персональными данными. Результат: время загрузки снизилось с 4–6 секунд до 800 мс–1,2 секунды — в 4–5 раз быстрее.

Весь UI построен как компонентная библиотека под задачи клиента: табличные списки заявок с фильтрами и пагинацией, канбан-доска для диспетчеров, форма подачи заявки с валидацией и drag-and-drop загрузкой документов, просмотрщик фотоотчётов с зумом. Никаких тяжёлых UI-фреймворков — только то, что нужно для конкретных задач.

Мобильное приложение: React Native + Expo + RuStore

Мобильное приложение разрабатывалось в первую очередь для мойщиков — людей, работающих руками в производственных условиях. Ключевые технические решения:

  • React Native + Expo — единая кодовая база для iOS и Android. Для ЛЕНХИМСИНТЕЗ приоритетной была публикация в RuStore (Android), что Expo обеспечивает без дополнительных трудозатрат и внешних зависимостей.
  • Push-уведомления через Expo Notifications + FCM. Мойщик моментально получает уведомление о новой заявке. Клиент — когда заявка переходит в статус «Выполнена» и отчёт готов к скачиванию.
  • Загрузка фотоотчётов. Приложение использует нативную камеру (через expo-camera) с компрессией изображений прямо на устройстве — экономит трафик на площадках со слабым интернетом, сохраняя достаточное для документирования качество.
  • Офлайн-буфер. Если соединение пропадает во время заполнения чеклиста, данные сохраняются локально и синхронизируются при восстановлении связи — мойщик не теряет заполненную форму.
  • Биометрическая авторизация. Вход через Face ID или отпечаток пальца — критично для производственной среды, где неудобно каждый раз вводить пароль в рабочих перчатках.

Интеграции и единый контур данных

Битрикс-бэкенд, Next.js-фронтенд и React Native приложение общаются через единый API — любое изменение статуса немедленно отражается на всех платформах. Генерация PDF-отчётов (акты мойки, сертификаты чистоты по стандарту EFTCO) — на стороне PHP с передачей готового документа в файловое хранилище. Уведомления: email через SMTP-шлюз Битрикс, push — через Expo Push Service → FCM. Такой подход к интеграциям позволяет поддерживать консистентность данных без дублирования логики.

Результаты: измеримый эффект за 2,5 месяца разработки

За 2,5 месяца мы поставили рабочую систему, которая изменила операционный процесс ЛЕНХИМСИНТЕЗ:

  • +30% заявок через личный кабинет. Клиенты стали значительно охотнее использовать онлайн-канал вместо телефона и email: интерфейс стал быстрым, понятным и работающим с мобильного.
  • +40% скорость обработки отчётов. Мойщики заполняют чеклист прямо на месте в приложении, фотоотчёт автоматически прикрепляется к заявке, PDF генерируется без участия администратора.
  • Покрытие Web + Android. Все три типа пользователей работают в единой экосистеме через удобный для них интерфейс — веб или мобильное приложение.
  • Кратное снижение нагрузки на поддержку. Количество звонков «на каком этапе моя заявка?» сократилось благодаря real-time статусам и push-уведомлениям.
  • Публикация в RuStore. Приложение прошло модерацию и доступно для корпоративного скачивания без необходимости использовать зарубежные маркеты или VPN.

Нужна похожая система для вашего B2B-бизнеса?

Если у вас B2B-платформа или личный кабинет на 1С-Битрикс, который «упирается в потолок» — медленный интерфейс, сложно масштабировать, нет мобильного доступа — мы знаем, как решить это без потери накопленной бизнес-логики и с предсказуемым бюджетом.

  • Веб-разработка — корпоративные порталы, личные кабинеты B2B, нестандартные веб-системы
  • FrontBox — headless Next.js — наш продукт для headless-переноса с сохранением Битрикс-бэкенда
  • Интеграции — связываем Битрикс с любыми внешними системами через REST API
  • E-commerce — когда проект вырастает до полноценного каталога с транзакциями

Другие кейсы

Headless-переезд с сохранением UX для товаров под заказ

Разделили монолитный Битрикс на headless-архитектуру: бэкенд остался на Битриксе, фронт перешёл на Frontbox. Сохранили полный UX корзины и оформления при ценах только по запросу.

Read more

Свой магазин вместо маркетплейса: Watch Triumph запускает независимый e-com на Frontbox

Бренд часов Watch Triumph ушёл от высоких комиссий маркетплейсов, запустив собственный интернет-магазин на Frontbox. 1С-Битрикс управляет товарами и заказами, интеграция с OZON перенесла весь каталог автоматически.

Read more

Следующий шаг

Работаете над похожей задачей?

Покажите техзадание или просто расскажите — разберёмся, подходит ли наш подход под вашу ситуацию.

Расскажите нам о своем проекте

Наши офисы

  • Россия
    Россия, Санкт-Петербург, Рижская улица, 5, корп. 1 офис 402
    +7 (967) 555-90-32
  • Казахстан
    Алма-Ата
    +7 (707) 340-29-12
Система отчётности для мойки танк-контейнеров: Битрикс + Next.js + мобильное приложение | WebGoodPeople