EN
Назад к проектамТекущий проект

Arbat Beauty CRM

Я развиваю внутреннюю CRM для салона красоты: перевожу легаси-части на компонентную React-архитектуру, стабилизирую сложные сценарии расписания и улучшаю UX рабочих экранов для администраторов.

Case Study

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

Задача

  • Легаси на JavaScript с дублированием бизнес-логики и сложной поддержкой.
  • Критичный сценарий расписания: много состояний, быстрые изменения, риск UI-ошибок.
  • Нужно переписывать модули без остановки поставки фич для бизнеса.

Решение

  • Переход на React + TypeScript и декомпозиция на переиспользуемые доменные компоненты.
  • Разделение server-state и client-state через React Query + Zustand.
  • Реализация drag-and-drop потока визитов с синхронизацией изменений на сервере.
  • Унификация форм через React Hook Form и сокращение дублирующихся обработчиков.

Текущий статус

Основной рабочий проект

Миграция

Ключевые экраны переписаны на React/TS

UX расписания

Стабильнее drag-and-drop и статусы визитов

Поддержка

Меньше дублирования и проще развитие фич
Пример компонента карточки визита
type VisitCardProps = {
  id: string;
  clientName: string;
  time: string;
  status: 'new' | 'confirmed' | 'done';
  onOpen: (id: string) => void;
};

export function VisitCard({ id, clientName, time, status, onOpen }: VisitCardProps) {
  return (
    <button className={`visit-card visit-card--${status}`} onClick={() => onOpen(id)}>
      <span className="visit-card__time">{time}</span>
      <span className="visit-card__client">{clientName}</span>
      <span className="visit-card__status">{status}</span>
    </button>
  );
}
Визуал компонента
Расписание мастера
10:30Анна Петроваnew
12:00Мария Ивановаconfirmed