Степан Дрогин DroginStepan
Создаю цифровые продукты, которые приносят результат
Рейтинг
1 712
№ 632 в каталоге
Отзывы
0
Профессионализм
-/10
Коммуникация
- /10
Город
Москва
Опыт работы
5 лет
На сайте с
2026 года
Юридический статус
Самозанятый

Дашборд аналитики продаж, товаров и заказов для e-commerce

Используемые навыки Nest.js PostgreSQL React.js Typescript

Описание

Задача — создать единую систему аналитики для интернет-магазина, чтобы данные о продажах, товарах, остатках и заказах не приходилось собирать из разрозненных таблиц и отчетов.

Проект разработан как практическая часть магистерской ВКР. Цель состояла не только в создании наглядного интерфейса, но и в проектировании полноценного web-приложения: с базой данных, серверной агрегацией, типизированным REST API и интерактивной визуализацией.

Система рассчитана на менеджеров и аналитиков e-commerce. На одном экране пользователь должен видеть ключевые показатели, оценивать динамику выручки и заказов за выбранный период, сравнивать категории и товары, контролировать остатки и быстро находить нужный заказ.

Решение

Я разработал fullstack-приложение в формате monorepo. В нем React-интерфейс, NestJS backend и общий пакет TypeScript-типов разделены на самостоятельные модули, но используют единые контракты данных.

Спроектировал реляционную модель PostgreSQL для товаров, категорий, пользователей, заказов и позиций заказа. Подключил Prisma, подготовил миграции и безопасный seed с демонстрационными данными.

На backend реализовал REST API и серверные расчеты: фильтрацию по периоду и категории, выручку без учета отмененных заказов, средний чек, долю завершенных заказов, динамику продаж, рейтинги товаров и структуру категорий. Для повторных аналитических запросов добавил Redis-кэш с автоматическим переходом на in-memory cache, если Redis недоступен.

На frontend создал три рабочих раздела: аналитический дашборд, товарный каталог и список заказов. Данные представлены через KPI-карточки, комбинированный график выручки и заказов, круговую диаграмму категорий, рейтинги и карточки сущностей. Добавил поиск, фильтры по датам, категориям и статусам, а также состояния загрузки, ошибки и отсутствия результатов.

Интерфейс адаптирован под разные размеры экрана. Графики на Apache ECharts перестраиваются для компактного viewport и реагируют на изменение контейнера. Визуальный язык собран на CSS Modules и общих дизайн-токенах; добавлены focus-состояния, ARIA-метки и поддержка prefers-reduced-motion.

Для публикации адаптировал NestJS API под Vercel Functions, настроил Prisma migrations/seed и опциональное кэширование. Подготовил перенос PostgreSQL-хостинга с Supabase на Neon: приложение автоматически возобновляет доступ к базе после простоя и не требует ручного восстановления проекта через семь дней.

Результат

В результате создано fullstack-приложение, которое объединяет аналитику продаж, контроль ассортимента и просмотр заказов в одном интерфейсе.

Пользователь может выбрать период и категорию, оценить выручку и динамику заказов, сравнить вклад категорий и товаров, проверить остатки, найти заказ по клиенту, товару или номеру и отфильтровать заказы по статусу.

Система включает три пользовательских раздела и девять REST endpoints. Архитектура разделяет интерфейс, API, слой данных и общие TypeScript-контракты, поэтому проект можно расширять новыми метриками и подключать к данным реального интернет-магазина. Ключевые расчеты аналитики, работу кэша и преобразование данных проверяют unit-тесты.

Проект подготовлен для локального запуска через Docker и production-развертывания на Vercel с managed PostgreSQL в Neon. В портфолио он показывает полный цикл разработки: от структуры данных и backend-логики до адаптивной визуализации и публикации приложения.

Оценили проект:

Другие проекты

Все проекты →
Веб-разработка и IT CodeAtlas — AI-сервис анализа GitHub-репозиториев и рисков Pull Request для разработчиков и техлидов
CodeAtlas — AI-сервис анализа GitHub-репозиториев и рисков Pull Request для разработчиков и техлидов
9