mpeshekhonov
EN

Проекты

Кейсы из реального опыта: задача → роль → стек → результат.

X5 Tech

Модуль согласования закупок НКЗ 3.0

Согласование закупок в X5: роли, статусы и длинные цепочки в одном интерфейсе

ReactTypeScriptKeycloakOrvalOpenAPIViteTanStack Queryreact-hook-form

Задача

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

Роль

Собрал UI-слой модуля: матрица RBAC, переходы состояний, формы с валидацией, история изменений. Делал задачу перехода сборки на Vite, подключал code splitting, Keycloak SSO и Orval по OpenAPI.

  • Модуль закрывает полный цикл согласования закупок в одном интерфейсе
  • Переход на Vite и code splitting ускорили работу с длинными сценариями
  • Orval убрал ручную синхронизацию типов при смене OpenAPI

POTALONU / PREEGLOS

PREEGLOS — редактор схем залов

Свой аналог seats.io: редактор зала для организаторов и виджет выбора мест

Next.jsReactCanvasPostgreSQLDrizzle ORMAuth.jsDockerCI/CD

Задача

Билетному сервису нужен свой seats.io-like редактор схем залов и виджет выбора мест, который можно встроить в сайт мероприятий без внешнего SaaS.

Роль

Редактор схем залов на Canvas, встраиваемый виджет выбора мест, события и бронирования. Витрина, checkout и Mini App на тех же API.

  • Организаторы заводят схемы залов и подключают выбор мест без отдельной разработки под каждую площадку
  • Встраиваемый виджет выбора мест работает на витрине и в Telegram Mini App
  • Данные о залах, местах и покупках остаются в инфраструктуре продукта

sendonate.com

sendonate.com — донаты и OBS-оверлей

Донаты для стримеров: кабинет, Mini App и OBS-оверлей

ReactViteTypeScriptTelegram Mini AppWebSocketOrvalDjango REST

Задача

Стример принимает донат в Telegram, настраивает алерты в кабинете и показывает их в OBS — три клиента, один backend sendonate.

Роль

В monolith/sendonate: React + Vite кабинет, Telegram Mini App и websocket-pages для OBS. Развивал дизайн виджетов донатов и функционал кабинета стримеров; Orval по OpenAPI, очередь алертов и reconnect на WebSocket.

  • Три клиента ходят в один API — донат не теряется между Mini App, кабинетом и эфиром
  • OBS-оверлей держит очередь алертов, если донаты идут пачкой
  • Sentry и Orval на фронте упрощают отлов ошибок и синхронизацию контрактов в production

ZodiacLab

ZodiacLab — маркетплейс и консультации

Маркетплейс услуг с каталогом, заказами и видеоконсультациями в браузере

Next.jsReactTypeScriptNest.jsWebRTCSocket.ioOrvalPlaywright

Задача

Продукту нужны витрина, личный кабинет, чаты и живые аудио/видео-консультации между пользователями — без разрыва между клиентом и backend.

Роль

zodiaclub-front на Next.js 15: каталог, ЛК, чаты. WebRTC через Socket.io (`webrtc_offer/answer/ice`), Orval, Playwright e2e. Доработки Nest.js backend.

  • Пользователь проходит путь от каталога до оплаченной консультации в одном продукте
  • Видеозвонки работают через WebRTC с очередью ICE-кандидатов до установки соединения
  • OpenAPI-контракты синхронизированы между клиентом и backend через Orval

SmartPrice

SmartPrice — Умный прайс

Веб-система прайсов, техкарт и финансовой модели для производства

Next.jsReactTypeScriptTailwind CSSZustandOrvalREST APIAxios

Задача

Производству нужен единый интерфейс: свой прайс, техкарты, прайсы поставщиков и конкурентов, финмодель и учёт — вместо разрозненных таблиц.

Роль

Собрал frontend на Next.js 16 и React 19: модули прайса, техкарт, финмодели, учёта, сотрудников. Zustand-сторы, REST через axios-сервисы, генерация клиента из OpenAPI (Orval), вёрстка по Figma.

  • Основной сценарий (мой прайс, техкарты, финмодель, учёт, сотрудники) работает с API в production-core
  • Типы и клиент API синхронизируются с backend через OpenAPI и Orval
  • Сложные таблицы и версии прайсов собраны под реальные экраны из Figma

ZodiacLab

ZodiacLab — Telegram-бот клиентов и специалистов

Хаб в Telegram: меню по роли, уведомления и ИИ-консультант

Nest.jsTelegram Bot APITypeORMPostgreSQLnode-cronTypeScript

Задача

Клиентам и специалистам нужны быстрые действия и напоминания в Telegram рядом с веб-кабинетом.

Роль

В zodiaclub-backend: polling-бот, привязка аккаунта к ЛК, меню по роли (клиент / специалист), push о консультациях, отзывах, заработке и просмотрах профиля. Хаб с кнопками и deep link на сайт.

  • Клиент и специалист получают напоминание за час до консультации
  • Специалист видит дайджесты: отзывы, заработок за неделю, просмотры профиля
  • Повторные push блокируются дедупом в PostgreSQL

ZodiacLab

ZodiacLab — Telegram-бот админов и модераторов

Оперативная модерация и уведомления staff без входа в веб-админку

Nest.jsTelegram Bot APITypeORMPostgreSQLTypeScript

Задача

Админам и модераторам нужно быстро реагировать на заявки специалистов, тикеты поддержки и отзывы прямо из Telegram.

Роль

Отдельный admin-бот в Nest.js: привязка ADMIN/MODERATOR, уведомления по правам, действия из чата (одобрить / отклонить / взять в работу / ответить), журнал действий, кнопка «Открыть в админке».

  • Staff получает push по ролям и правам, без смешения с user-ботом
  • Заявки, тикеты и модерацию отзывов можно закрыть прямо из Telegram
  • Каждое действие пишется в журнал для аудита

ZodiacLab

ZodiacLab — CRM-бот и Mini App

База специалистов, воронка и задачи прямо в Telegram

Node.jsExpressGrammyPostgreSQLTelegram Mini AppDocker

Задача

Команде продаж нужна лёгкая CRM по специалистам: контакты, этапы воронки, задачи и статистика — без тяжёлой внешней системы.

Роль

Self-hosted сервис на Express + Grammy + PostgreSQL: роли admin/manager/viewer, импорт базы специалистов, Telegram-бот и Mini App (задачи, статистика), напоминания по cron.

  • База специалистов и воронка доступны из бота и Mini App
  • Задачи с напоминаниями утром по расписанию (MSK)
  • Деплой через Docker / Coolify на своей инфраструктуре

НЛМК

Регистрация выпусков чугуна

Производственные данные доменного цеха вместо Excel и бумажных форм

ReactTypeScriptKeycloakTanStack TableTanStack QuerySentryREST API

Задача

Операторы доменного производства фиксировали выпуски чугуна вручную: данные терялись, фильтрация по сменам занимала время, сеть на площадке нестабильная.

Роль

Собрал SPA на React с TanStack Table для больших объёмов данных, кэшированием через React Query и мониторингом через Sentry. Настроил вход через Keycloak.

  • Ключевые операции цеха переведены в единый веб-интерфейс
  • Таблицы с фильтрами и виртуализацией — большие объёмы данных без просадки UX
  • Sentry сократил время поиска ошибок в продакшене

SmartFish

SmartFish KKM — касса на планшете

React Native (Expo) касса: смены, продажи, оплаты и POS-терминал

React NativeExpoTypeScriptExpo RouterNativeWindZustandEASREST API

Задача

Рознице SmartFish нужна касса на планшете: открытие смены, корзина, нал и безнал, работа с POS-терминалом в магазине.

Роль

Собрал мобильное приложение на React Native и Expo (Expo Router, NativeWind, Zustand): авторизация кассира, смены, каталог, корзина, оплаты (нал / карта / QR на терминале), роли кассир и админ/менеджер, сборки через EAS.

  • Кассир ведёт смену и продажи с планшета в магазине
  • Безнал уходит на POS-терминал по локальной сети с печатью чека
  • Разные роли: продавец на смене, админ/менеджер в режиме просмотра без открытия смены

SmartFish

SmartFish — сервис управления

Сервис управления рыбоводными хозяйствами: участки, цехи, склады, сотрудники

ReactTypeScriptViteEffectorFSDOrvalYandex MapsRecharts

Задача

В производственном сервисе десятки сущностей, ролей и API-контрактов: операторам нужен один предсказуемый интерфейс вместо разрозненных экранов.

Роль

Развиваю smartfish-frontend на React + TypeScript: участки, бассейны, склады, цехи, сотрудники, RBAC, карты Yandex Maps и аналитика. Клиент и типы генерируются из OpenAPI (Orval).

  • Модульная структура удерживает производственные экраны в понятных границах вместо одного большого SPA
  • RBAC, карты, склады и аналитика живут в одном интерфейсе для операционных ролей
  • OpenAPI держит типы фронта и backend в синхроне

Citilink

Миграция e-commerce на Next.js

Каталог и главная: с PHP/Symfony на Next.js без потери SEO

Next.jsReactTypeScriptJavaScriptREST APISSRJestGit

Задача

Крупный e-commerce переносил каталог и главную с легаси PHP/Symfony на Next.js, сохраняя фильтры, SSR и согласованность с микросервисами.

Роль

Участвовал в миграции интернет-магазина: SSR на Next.js, фильтрация, сортировка, пагинация с состоянием в URL, REST API с backend-командами. Code review, Jest.

  • Каталог интернет-магазина на Next.js с сохранением SEO
  • Фильтры синхронизированы с URL для оптовых и розничных сценариев
  • REST-контракты согласованы с backend и микросервисами

BI.ZONE

Threat Intelligence

Аналитика угроз: графы связей, отчёты и тяжёлые таблицы

ReactD3.jsGraphQLApollo ClientMobXReact QueryOrvalHighcharts

Задача

Аналитикам безопасности нужны графы сущностей, фильтры по большим наборам данных и настраиваемые дашборды в одном продукте.

Роль

Страница анализа сущностей: граф связей на D3.js, сложные фильтры, GraphQL-отчёты на Apollo Client. npm-пакеты @bizone, виртуализация тяжёлых списков.

  • Аналитики строят цепочки связей между сущностями в одном экране
  • Динамические отчёты подключены к той же GraphQL-модели, что и основные сценарии
  • Виртуализация держит большие таблицы без просадки UX

POTALONU

potalonu.com — афиша и билеты

Витрина мероприятий и покупка билетов в вебе и Telegram Mini App

Next.jsOrvalTanStack Querynext-intlTelegram Mini AppChart.js

Задача

Билетному сервису нужны одинаковые сценарии покупки в браузере и в Telegram, плюс аналитика для организаторов.

Роль

Собрал витрину на Next.js 16: Orval, TanStack Query, формы React Hook Form + Zod, next-intl, Mini App на `@twa-dev/sdk`, графики Chart.js.

  • Покупка билета доступна и в вебе, и в Mini App с общей логикой
  • Организаторы видят базовую аналитику по продажам
  • Локализация покрывает ключевые пользовательские сценарии

NDA

Маркетплейс (NDA)

Маркетплейс с нуля: каталог, checkout, i18n

Next.jsTypeScriptTailwind CSSOrvalReact Hook FormZodnext-intlPlaywright

Задача

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

Роль

Собрал приложение на Next.js 14: Orval, TailwindCSS, React Hook Form + Zod, next-intl, Storybook, e2e на Playwright, Sentry в production.

  • Пользовательский флоу от каталога до checkout закрыт в одном приложении
  • OpenAPI-клиент генерируется автоматически — меньше ошибок интеграции
  • Playwright и Storybook страхуют регрессии UI

In2View

In2View — B2B-платформа исследований

Мэтчинг респондентов и заказчиков для кастдев-исследований

ReactRedux ToolkitFirebaseGatsbyFramer MotionJWT

Задача

Стартапу нужен MVP: поиск респондентов, анкеты, роли, отчёты и маркетинговый сайт — с нуля до production.

Роль

Разработал платформу на React + Redux Toolkit и REST API, маркетинг на Gatsby + Contentful, Firebase Auth с 2FA и PWA.

  • MVP вышел в production с ролевой моделью и мэтчингом по анкетам
  • PWA и 2FA закрыли базовые требования корпоративных клиентов
  • Маркетинговый сайт и приложение развиваются параллельно

Ростелеком

Яга — корпоративный трекер задач

Модуль шаблонов бизнес-процессов в аналоге Jira

ReactTypeScriptRedux ToolkitOpenAPIREST API

Задача

Корпоративной системе нужны настраиваемые шаблоны процессов без правок кода при каждом новом сценарии.

Роль

Модуль шаблонов на React + Redux Toolkit, REST по OpenAPI. Декомпозиция задач, code review, мемоизация тяжёлых экранов.

  • Шаблоны процессов настраиваются без участия разработчиков
  • OpenAPI-контракт синхронизирован между frontend и backend
  • Команда работала в Scrum с регулярным CR

СберТех

СберТех — корпоративная база знаний

Confluence-like продукт: микрофронты, UI Kit и автотесты

ReactTypeScriptModule FederationWebpackUI KitPlaywrightJest

Задача

Внутренней корпоративной базе знаний нужны независимые разделы, общий UI Kit и стабильные пользовательские сценарии для команд, которые ведут документацию и рабочие материалы.

Роль

Разрабатывал новый функционал на React, дорабатывал компоненты UI Kit и интегрировал части приложения в микрофронтовую архитектуру через Module Federation. Писал автотесты для пользовательских сценариев, включая Playwright e2e-тесты.

  • Новый функционал встраивался в общий Confluence-like продукт без отдельного приложения
  • UI Kit помогал держать единый интерфейс между разделами корпоративной базы знаний
  • Playwright-тесты закрывали ключевые пользовательские сценарии и снижали риск регрессий

СберТех

OpenSearch Dashboards + Vault

Автоматизация сертификатов и визуализация логов

Node.jsOpenSearch DashboardsVaultGitLab CIJestKibana

Задача

OpenSearch Dashboards нужно безопасно подключить к Vault и обновлять TLS-сертификаты без ручных операций.

Роль

Небольшие доработки вокруг интеграции Dashboards с Vault на Node.js, GitLab CI для ротации сертификатов и Jest-тестов на pipeline.

  • Сертификаты обновляются через CI без ручных операций
  • Jest покрывает критичные шаги интеграции
  • Модуль визуализации подключён к корпоративному контуру

SmartFish

SmartFish — API витрины и B2B

NestJS backend для заказов, корзины, оплат и админки (akvaprom / B2B)

NestJSTypeORMPostgreSQLOpenAPIDockerWebSockets

Задача

Публичная витрина, B2B-кабинет и Aquaprom сидят на одном API — нужны заказы, корзина, RBAC и платежи в одном backend.

Роль

Дорабатываю smartfish-landing/apps/backend: orders, cart, payments, promocodes, bonus system, admin, RBAC. TypeORM + PostgreSQL, webhooks, websockets.

  • B2B и розница ходят в один backend через /backend-api
  • Админка закрывает каталог, пользователей, промокоды и бонусные сценарии
  • Контракты отдаются фронтам b2b-sm и landing-smartfish

SmartFish

SmartFish — витрина akvaprom.kg

Next.js интернет-магазин: каталог, checkout, бонусы, промокоды, SEO

Next.jsReactTypeScriptTailwind CSSFramer MotionYandex Metrika

Задача

Нужен маркетинговый сайт и интернет-магазин на одном домене (akvaprom.kg): каталог, checkout, профиль, бонусы и промокоды без смешения с ERP-клиентом.

Роль

Витрина на Next.js: главная с каруселями и категориями, shop, checkout, профиль, бонусы, промокоды, Yandex Metrika, Framer Motion.

  • Покупатель проходит путь от главной до checkout без перехода в ERP
  • Бонусы и промокоды вынесены в пользовательские сценарии интернет-магазина
  • Витрина akvaprom.kg вышла на первую страницу Яндекса по целевому направлению

SmartFish

SmartFish — Telegram-боты

B2B-отчёты в Telegram и уведомления о розничных заказах

NestJSTelegram Bot APITypeORMPostgreSQLnode-cron

Задача

Менеджерам B2B нужны утренние/дневные сводки заказов в Telegram, а рознице — мгновенное сообщение о новом заказе.

Роль

В smartfish-landing/backend: telegram-reports (ежедневные XLSX-отчёты B2B, напоминания), aquaprom-telegram (webhook-бот, подписчики), уведомления о retail-заказах.

  • Отчёт B2B уходит в чат по расписанию с XLSX-вложением
  • Новый розничный заказ триггерит сообщение в Telegram
  • Подписчики и команды бота хранятся в PostgreSQL

Stratwise

Stratwise.ai — торговые стратегии

Конструктор стратегий и графики котировок

ReactViteTradingViewRechartsFirebaseaxios

Задача

Трейдерам нужен веб-интерфейс для сборки стратегий и просмотра котировок в реальном времени.

Роль

Реализовал экраны на React + Vite, интеграцию с Firebase, графики TradingView lightweight-charts и Recharts, REST через axios.

  • Пользователь собирает и просматривает стратегии в одном интерфейсе
  • Графики котировок синхронизированы с REST-данными
  • Firebase закрывает auth и базовое хранение настроек

Quan2um

Quan2um — криптобиржа

Торговый терминал: стакан, ордера, кошелёк Solana

LitSolanaweb3.jssocket.ioesbuildTradingView

Задача

Бирже нужен быстрый торговый UI с потоком котировок и интеграцией кошельков Solana.

Роль

Разрабатывал интерфейс на Lit, поток рынка через socket.io, web3.js и адаптеры кошельков, сборка esbuild.

  • Ордера и стакан обновляются по WebSocket без перезагрузки страницы
  • Кошелёк Solana подключён к сценариям торговли
  • esbuild даёт быстрые итерации при разработке UI

Maximaster / e-commerce

Интернет-магазин на 1C-Bitrix

Каталог, корзина и фильтры в коммерческом e-commerce

1C-BitrixPHPHTML5CSS3SCSSjQueryJavaScriptWebpack

Задача

Интернет-магазину косметики нужны адаптивный каталог, фильтры и корзина в рамках 1C-Bitrix и Symfony.

Роль

Дорабатывал компоненты и шаблоны 1C-Bitrix: каталог, карточки товаров, фильтры, корзина. HTML5, CSS3/SCSS, jQuery, JavaScript, Webpack, Git. Интеграция с backend на PHP/Symfony.

  • Адаптивный каталог и карточки на всех breakpoints
  • Фильтры и корзина стабильны на production
  • Коммерческая разработка в команде с Git и code review

Maximaster / e-commerce

fitomarket.ru

Магазин фитопродукции на Bitrix

1C-BitrixPHPHTML5SCSSjQueryJavaScriptWebpackGit

Задача

E-commerce на Bitrix с большим каталогом: нужны стабильные фильтры и быстрая карточка товара.

Роль

Доработка каталога, фильтров и карточек; оптимизация фронтенда под мобильный трафик.

  • Каталог и фильтры стабильны на production
  • Карточки товаров адаптированы под mobile

Energosoft

energosoft.ru

Учёт электроэнергии для энергосбытовых компаний

Symfony1C-BitrixPHPjQueryJavaScriptSCSSWebpackGit

Задача

Сервис учёта электроэнергии для энергосбытовых компаний работал на тяжёлых postback-формах; нужен отзывчивый UI для форм и отчётов.

Роль

Перевёл формы и таблицы на AJAX, доработал UI на Symfony + Bitrix.

  • Формы и отчёты работают без полной перезагрузки страницы
  • Пользователи быстрее заполняют типовые сценарии

Baucenter

Бауцентр

Интернет-магазин на Next.js

Next.jsReactTypeScriptHTML5SCSSREST APIWebpackGit

Задача

Интернет-магазину строительных материалов нужны каталог и корзина на современном frontend-стеке.

Роль

Разрабатывал интерфейсы каталога и корзины на Next.js, адаптивная вёрстка и интеграция с backend API.

  • Каталог и корзина работают на mobile и desktop
  • Изменения выкатывались без простоя витрины

Specdep

specdep.ru

Корпоративный сайт на Bitrix

1C-BitrixPHPHTML5SCSSjQueryJavaScriptWebpackGit

Задача

Корпоративному сайту нужна поддержка и развитие фронтенда в легаси Bitrix.

Роль

Поддержка и развитие разделов сайта, вёрстка новых блоков на Bitrix + jQuery.

  • Новые разделы выходили в срок в рамках CMS
  • Единый SCSS-стек для всех страниц

Energosoft

workshop.energosoft.com

Учёт электроэнергии для энергосбытовых компаний

1C-BitrixPHPHTML5SCSSjQueryJavaScriptWebpackGit

Задача

Энергосбытовым компаниям нужен web-интерфейс для учёта электроэнергии: формы, таблицы и отчёты.

Роль

Разрабатывал клиентскую часть сервиса: формы и таблицы на AJAX, интеграция с Symfony/Bitrix backend.

  • Клиентский UI стабилен на production
  • Формы синхронизированы с backend

FC Zenit

tickets.fc-zenit.ru

Продажа билетов и схема стадиона

CanvasJavaScriptREST API

Задача

Болельщику нужно выбрать место на интерактивной схеме стадиона и оформить билет.

Роль

Отрисовка схемы стадиона на Canvas, интеграция с backend продажи билетов.

  • Интерактивный выбор мест на схеме арены
  • Схема синхронизирована с доступностью мест

Коммерческий проект

Aurumline WebView

WebView-клиент под мобильное приложение

ReactTypeScriptWebView

Задача

Мобильному приложению нужен встроенный web-клиент с ограничениями WebView.

Роль

Адаптировал React-интерфейс под WebView: viewport, навигация, bridge с native.

  • UI работает в iOS и Android WebView
  • Навигация согласована с native shell

Коммерческий проект

DuckMaster — игра в Telegram

Игровой Mini App: онбординг, боевая механика и стабильные релизы

ReactRedux-SagaViteVitestWebSocketTelegram Mini App

Задача

Игре в Telegram нужны новый онбординг и механика атак без просадки производительности на слабых устройствах.

Роль

Вынес игровую логику в Redux-Saga, оптимизировал Vite-сборку и конвертацию в WebP, покрыл ключевые сценарии Vitest.

  • Новый онбординг и атаки выкатились без регрессий в core-лупе
  • WebP и chunking уменьшили вес ассетов для мобильных клиентов
  • Vitest страхует релизы игровых сценариев

Коммерческий проект

HandStars — игра в Telegram

Mini App с real-time, TonConnect и анимациями

ReactMobXsocket.ioTonConnectOrvalFramer MotionTelegram Mini App

Задача

Игра должна работать в Telegram WebApp: сокеты, кошелёк TON, анимации и аналитика — в одном клиенте.

Роль

Собрал UI на React + MobX, real-time через socket.io, TonConnect, Orval для REST, Framer Motion и Lottie для анимаций.

  • Играбельный Mini App с оплатами через TON
  • Real-time события не блокируют UI благодаря отдельному слою состояния
  • Аналитика Telegram подключена для продуктовых решений

Коммерческий проект

Симулятор IT-карьеры

Пиксель-арт игра о карьере разработчика в Telegram

Next.jsZustandSupabaseTelegram WebAppTailwind CSS

Задача

Нужен лёгкий игровой MVP внутри Telegram с сохранением прогресса между сессиями.

Роль

Собрал игру на Next.js App Router, Zustand, Radix UI, Supabase SSR для профиля и прогресса, адаптация под WebApp viewport.

  • Играбельный MVP внутри Telegram без отдельной установки
  • Прогресс сохраняется в Supabase между заходами
  • UI адаптирован под ограничения WebApp

Открыт к предложениям

Senior Frontend / Fullstack — удалённо или гибрид. Напишите в Telegram или на почту, отвечу в течение дня.