Платформа данных Экосистемы

SDP Enablers — внутренняя платформа Сбера, имеющая важное стратегическое значение, для управления подписками на данные между дочерними организациями (ДЗО): ОККО, Ситидрайв, Delivery Club и другими. Платформа позволяла оформлять подписки на дата-продукты, управлять ими и визуализировать сложные связи между организациями, дата-продуктами, датасетами и их атрибутами.

Основная работа строилась вокруг большого количества таблиц, многоэтапных форм с зависимостями между полями (условное появление полей, динамические данные для селектов) и интерактивного дашборда связей.

---

Моя роль

Пришёл на проект с большим объёмом легаси и техдолга. Благодаря проактивной позиции по устранению этих проблем был назначен Frontend Team Lead. Отвечал за архитектурные решения, код-ревью всех PR, развитие UI-кита и внедрение инженерных практик в команде. Параллельно участвовал в backend-разработке на Python.

---

Ключевой кейс: трёхуровневый дашборд связей

Самая технически интересная задача — разработка интерактивного дашборда, визуализирующего потоки данных на трёх уровнях: Организации → Дата-продукты → Датасеты.

В основу взята библиотека React Flow, но потребовалось значительное количество кастомизации:

• Хендлеры внутри узлов. По умолчанию React Flow размещает connection-хендлеры по краям ноды. В нашем случае хендлеры должны были находиться внутри узла — для каждого дата-продукта или датасета отдельно.
• Динамическая перестройка связей. Хендлеры одного узла могли быть связаны с хендлерами разных узлов. При раскрытии дата-продукта на датасеты все рёбра (edges) динамически пересчитывались и перерисовывались.
• Drill-down на любом уровне. Любой дата-продукт или датасет можно было развернуть вплоть до атрибутов — самой базовой единицы данных.

С продуктовой стороны это выглядело так: данные из одной организации могли поступать в несколько других; один дата-продукт мог поставлять данные в несколько дата-продуктов; при раскрытии уровня связи перестраивались автоматически.

---

Что сделал на фронтенде

Архитектура и миграции

• Перевёл 70% кодовой базы с JavaScript на TypeScript — без даунтайма.
• Внедрил FSD-подобную архитектуру, что ускорило разработку новых фич в среднем на ~20%.
• Мигрировал ~60% функциональности на новую архитектуру — без простоев.

CI/CD и Developer Experience

• Мигрировал проект с Webpack на Vite: dev-сборка ускорилась с 70 с до 8 с, HMR — с 5 с до 0.5 с (ускорение цикла разработки в 9×).
• Внедрил React Query для управления серверным состоянием, что улучшило производительность и UX за счёт кеширования, дедупликации запросов и оптимистичных обновлений.

UI-кит и компоненты

• Расширял UI-кит, используемый четырьмя продуктовыми командами: разработал 3 новых переиспользуемых компонента, оптимизировал 10 существующих.

Тестирование

• Внедрил тестирование с нуля (Jest + React Testing Library + MSW).
• Покрыл ~60% критичной бизнес-логики юнит- и интеграционными тестами.

Процессы и культура

• Проводил код-ревью 100% пул-реквестов.
• Разработал code style и best practices guide для команды — это сократило время ревью и позволило ссылаться на объективные стандарты. Среднее время доставки фичи сократилось с 5 до 3 дней.

---

Что сделал на бэкенде

• Проектировал и поддерживал кластер из ~10 микросервисов на FastAPI / Starlette.
• Разрабатывал RESTful API для веб-приложения.
• Писал Alembic-миграции при создании новых фич.
• Оптимизировал запросы через SQL-RAW (CTE, JOIN, оконные функции).
• Разработал микросервис Scheduler для изоляции крон-логики и взаимодействия с Kafka.

---

Результаты в цифрах

Метрика	Было	Стало
Dev build	70 с	8 с
HMR	5 с	0.5 с
Среднее время доставки фичи	5 дней	3 дня
Покрытие тестами (критичный код)	0%	~60%
Миграция на TypeScript	0%	70%

---

Технологии

Frontend: React, TypeScript, React Router, Redux Toolkit, React Query, React Flow, Mermaid, Vite, Ant Design, Styled Components, Jest, React Testing Library, MSW

Backend: Python, FastAPI, Starlette, PostgreSQL, Alembic, Kafka