Frontend разработчик

Разрабатывал фронтенд существующего SPA, внедрял лучшие практики, оптимизировал и ускорял продукт
LP-UI-User - Платформа позволяет строй.фирмам контролировать выполнение задач,документооборот, а также работать в команде удалённо или в офисе в единой программной среде

стек технологий: .Net, C#, Confluence, GitLab, GitLab CI/CD, Javascript, Jest, Jira, Mobx, Next, React-router-dom

- Реализовал поддержку светлой и тёмной темы интерфейса с автоматическим сохранением выбора в localStorage. Настроил реактивное обновление стилей и адаптацию компонентов под обе темы. Улучшил пользовательский опыт и визуальное восприятие приложения.

- Настроил ESLint с кастомными правилами и Prettier для единообразия кода в модуле справочников. Внедрил Husky для автоматической проверки перед коммитами. Это улучшило читаемость кода и снизило количество ошибок на этапе разработки.

- Провел рефакторинг устаревшего кода в модуле отчетов и дашбордов, переписав его с использованием современных возможностей Next и серверного рендеринга через getServerSideProps. Интегрировал React-Table для оптимизации отображения данных. Это улучшило производительность и читаемость кода.

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

- Реализовал режим “Глубокий архив”, ограничивающий доступ к объектам в зависимости от ролей и интервалов активности. Добавлены кнопки входа/выхода для администраторов, локализация интерфейса и обновление связанных списков.

- Реализовал виртуализацию таблиц и списков с помощью React Virtualized, чтобы обеспечить плавную работу интерфейса при тысячах записей. Теперь пользователи могут без задержек прокручивать и фильтровать большие массивы данных. Решение повысило отзывчивость UI и снизило нагрузку на браузер, особенно в корпоративных аккаунтах с большими базами.

- Интегрировал TanStack Query в проект, построенный на MobX, чтобы унифицировать работу с серверными данными и кэшированием. Это позволило избавиться от самописной логики кэширования данных и улучшить функционал.

- Добавил функциональность drag’n’drоpдля изменения порядка элементов с синхронизацией через API. Реализовал анимации и debounce-механизм отправки данных. Улучшил UX и ускорил взаимодействие с большими списками.

===========================================

LP-UI-Admin — это административная панель для внутренней системы управления контентом и пользователями. Проект включал разработку интерфейса с динамическими таблицами, фильтрами и дашбордами, а также интеграцию с API для отображения данных.

стек технологий: .Net, Confluence, Docker, GitLab, GitLab CI/CD, Jira, Mobx, Next, Styled-components, Tanstack-table, TypeScript

- Создал новый функционал в панели управления пользователями, позволяющий администраторам настраивать кастомные роли с уникальными правами доступа. Использовал библиотеку React-Query для оптимизации запросов к API и MoБудь добр для этой задачи описать детальную реализацию, почему сложная и почему интересная.bx для локального управления состоянием. Реализовал динамическую валидацию форм с помощью React-hook-form, что упростило создание сложных ролей и повысило удобство работы сотрудников.

- Внедрил возможность предпросмотра материалов в разделе управления контентом. Использовал библиотеку React-Markdown для рендеринга текстового контента и React-Viewer для отображения изображений. Настроил синхронизацию данных с помощью Axios, что позволило администраторам видеть изменения в реальном времени и минимизировать ошибки при публикации.

- Усовершенствовал модуль генерации отчетов, добавив экспорт в дополнительные форматы и настройку параметров. Интегрировал библиотеку jsPDF для создания PDF-документов и XLSX для работы с таблицами. Результатом стало повышение удобства анализа данных для внутренних сотрудников.

- Провел онбординг для новых членов команды, подготовив гайды по архитектуре фронтенда и основным инструментам, таким как Next.js и Mobx. Организовал серию встреч для объяснения работы с Tanstack-table и Styled-components, что помогло новичкам быстрее адаптироваться и начать продуктивную работу над задачами.

- Инициировал обсуждение с командой по оптимизации процесса код-ревью, предложив внедрение чек-листов и использование инструмента SonarQube для анализа качества кода. Это позволило сократить время на исправление ошибок и повысить стандарты разработки в разделе управления контентом.

- Выполнил рефакторинг устаревшего кода в разделе журнала активности, устранив дублирование логики и оптимизировав производительность. Использовал библиотеку Lodash для работы с данными и переписал компоненты с учетом современных хуков React. Результатом стало ускорение загрузки данных и улучшение читаемости кода.

- Настроил тестовое покрытие для модуля расширенного поиска и фильтров, используя Jest для unit-тестов, Cypress для e2e-тестов и Testing Library для интеграционных проверок. Это позволило выявить скрытые баги в логике фильтрации и повысить надежность функционала перед релизом.

- Разработал и задокументировал UI-компоненты для темной и светлой тем интерфейса в Storybook, используя Styled-components для стилизации. Настроил интерактивные примеры с помощью @storybook/addon-controls, что упростило тестирование дизайна и согласование с продуктовой командой.

- Провел обновление версий Next.js и ключевых библиотек в модуле интеграции с API, устранив уязвимости и улучшив производительность. Интегрировал React-Profiler для анализа узких мест и применил мемоизацию с помощью React.memo, что сократило время рендеринга при обновлении данных.

Модуль онлайн покера для гемблинг сайтов. Есть разные виды столов + турниры или обычная игра. Раздача карт, деление банков.

Стек технологий: Composer, Confluence, Docker, GitHub, Guthub CI/CD, Js, MySQL, React, React-motion, React-query, Redux, TypeScript

- Настроил анимации раздачи карт и перемещения фишек с помощью React Motion, добился плавных переходов и синхронизации с игровыми событиями SSE для повышения вовлеченности пользователей

- Реализовал интерактивный стол покера на React и TypeScript с поддержкой до десяти игроков, интегрировал систему статусов и состояний стола через Redux для стабильного мультиплеерного игрового процесса

- Спроектировал интерфейсы ставок блайнд анте чек колл рейз олл ин на React, настроил обновление состояния через Redux и React Query для корректного отображения стеков и действий игроков в реальном времени

- Участвовал во внедрении фронтенд логики раздачи карт и вычисления победителя, обеспечил корректное отображение комбинаций и результирующих банков в интерфейсе стола на TypeScript

- Интегрировал поддержку Server Sent Events на фронтенде, реализовал подписку на игровые события и обновление интерфейса для действий игроков в реальном времени без ручной перезагрузки стола

- Доработал клиентскую логику и UI для турнирных режимов и кеш игр, разделил сценарии отображения уровней блайндов и состояния игроков, упростил навигацию между типами покерных столов

- Создал лобби на React для выбора стола лимитов и типа игры, реализовал фильтры и сортировку с использованием React Query для загрузки доступных столов из API без лишних запросов

- Реализовал визуальную подсветку активного игрока и состояние таймера хода через Redux, добавил подсказки интерфейса для доступных действий, уменьшив количество ошибочных нажатий

- Добавил фронтенд чат для стола на React, реализовал подписку на сообщения через SSE, прокрутку и индикацию новых сообщений, улучшив коммуникацию игроков во время покерной сессии

- Внедрил интерфейс кастомизации профиля и выбора аватаров, связал клиентскую часть с API на React и TypeScript, обеспечил обновление данных в лобби и за столом без перезагрузки

- Переработал структуру Redux стора, нормализовал игровые данные стола и лобби, сократил количество ререндеров компонентов и упростил отладку за счет ясной декомпозиции слайсов

- Интегрировал React Query для загрузки и кеширования данных столов и профилей, настроил автоматический рефетч по SSE триггерам, уменьшил сложность ручного управления состоянием запросов

- Проводил код ревью фронтенд задач в GitHub, настраивал проверки через GitHub CI CD, предлагал улучшения по TypeScript типизации и разделению ответственности компонентов

- Подготовил и поддерживал в актуальном состоянии фронтенд гайдлайны в Confluence, описал подходы к работе с Redux React Query и SSE, облегчил онбординг новых разработчиков в команду

==============================================

Игровой модуль для гэмблинг-платформы, где пользователи могли вращать колесо и выигрывать призы. Реализован с применением анимационной библиотеки GSAP и Fetch-запросов для взаимодействия с сервером

стек технологий: Fetch API, Docker, GSAP, GitHub, JS, PHP, React, Symfony, TypeScript

- Вёл ревью кода команды, внедрил единые стандарты (ESLint, Prettier, шаблоны PR). Проводил онбординг новых разработчиков, помогал в освоении Next.js и архитектурных принципов. Это ускорило адаптацию сотрудников и повысило качество кода.

- Оптимизировал загрузку критических JS/CSS, внедрил lazy-loading и prefetching данных. Это сократило время до интерактивности и улучшило показатели Core Web Vitals, повысив отзывчивость интерфейса и удержание пользователей.

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

- Реализовал полноценный игровой модуль с использованием React и GSAP: вращение колеса с плавной анимацией, система призов с серверной валидацией результатов через Fetch. Модуль стал частью продуктовой линейки и приносил компании новые продажи за счёт интеграции на клиентские сайты.

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