Обязанности и достижения:
Разработал комплексное решение для автоматизации программ лояльности в крупной распределенной компании. Система состоит из двух взаимосвязанных модулей:
Employee Portal - персональный кабинет сотрудника с возможностью просмотра и использования бонусов.
HR Admin Panel - централизованная система управления программой.
Основные функциональные возможности:
- Персонализированный каталог бонусов и скидок с геозависимым отображением (учет региона сотрудника).
- Механизм подачи заявок на подключение новых партнеров к программе лояльности.
- Гибкая система настройки правил начисления и списания бонусов.
Основной функционал:
- Персонализированный каталог бонусов и скидок с геозависимым отображением (учет региона сотрудника);
- Механизм подачи заявок на подключение новых партнеров
- Ключевые задачи и реализованный функционал;
- Гибкая система настройки правил начисления и списания бонусов
Детали реализации и ключевые решения (Employee Portal):
1. Разработка пользовательского интерфейса:
Разработка нового функционала:
- Реализация страницы обратной связи для сотрудников.
- Создание таблицы с бесконечной прокруткой и возможностью фильтрации данных.
- Разработка системы уведомлений (toast) для важных событий, таких как появление новых предложений в регионе сотрудника (использованы веб-сокеты).
Исправление ошибок (багфиксинг):
- Устранение некорректной логики закрытия всплывающих окон.
- Исправление неверного отображения состояний формы авторизации.
- Рефакторинг и исправление логики работы, устранение лишних рендеров и ошибок в компонентах UI-библиотеки (select, checkbox, input, маски для input, dropdown, popup).
- У странение ошибок верстки и CSS-анимации.
- Устранение пропущенных ранее ошибок типов и линтера.
- Исправление проблем с тач-событиями, увеличение кликабельных зон иконок, устранение “залипания” ховеров.
- Обработка и корректное отображение контента при получении некорректных данных с бэкенда (null, undefined).
2. Рефакторинг и улучшение архитектуры приложения:
- Переработка формы авторизации: удалены лишние рендеры, сокращен объем кода, исключены хуки useEffect, добавлено отображение ошибок.
- Внедрение ленивой загрузки страниц (lazy loading) для оптимизации начальной загрузки приложения.
- Настройка husky pre-commit и pre-push для автоматической проверки кода перед коммитом и отправкой.
- Инициация добавления в CI-пайплайн задач по запуску линтера и тестов.
- Предложение и реализация добавления слагов для категорий.
3. Адаптивная разработка:
- Разработка адаптивного интерфейса для мобильной версии приложения.
4. Код-ревью:
- Проведение ревью кода коллег.
2. Админ-панель:
Разработка архитектуры:
- Участие в разработке архитектуры приложения. Выбор модульной архитектуры, оптимальной для админ-панели, обеспечивающей масштабируемость и поддерживаемость без излишнего усложнения.
- Настройка окружения разработки:
- Настройка окружения разработки и конфигурация необходимых библиотек и инструментов (Vite, ESLint, Prettier, Vitest, Husky, Zustand, React Query).
Реализация авторизации:
- Разработка логики авторизации на основе JWT (JSON Web Token), с использованием access и refresh токенов, а также формы восстановления пароля с отображением ошибок.
Интеграция UI-библиотеки:
- Интеграция библиотеки PrimeReact для создания пользовательского интерфейса.
- Стилизация компонентов в соответствии с дизайн-макетом.
Разработка таблицы:
- Разработка универсальной, строго типизированной таблицы на базе PrimeReact с возможностями фильтрации, выполнения действий и пагинации. Структура таблицы определяется через объект конфигурации, обеспечивая динамическое отображение необходимых полей и данных.
Форма изменения статуса бенефита:
- Разработка формы изменения статуса бенефита со сложной логикой отображения доступных статусов, зависящей от текущего статуса, и возможностью отправки обратной связи в случае отклонения.
Форма создания бенефита:
- Разработка сложной многоступенчатой формы создания бенефита с валидацией на каждом шаге и зависимыми полями (диапазон дат и скидок, зависимость от типа скидок, региона и т. д.). Состояние формы сохраняется в локальном хранилище (localStorage).
Коммуникация и сотрудничество:
- Активное взаимодействие с разработчиками бэкенда и DevOps-инженерами для решения технических проблем и повышения эффективности процесса разработки.
Задачи отслеживались в Jira.
Технологический стек:
HTML, CSS, SCSS, JavaScript, TypeScript
React, Redux, RTK Query, Vite, Zustand, React Query, React Hook Form, Zod
PrimeReact, Git, GitHub, GitLab, Jira, Docker, Nginx, Husky, WebSockets.