На главную
Кейсы

Инженерный подход в деле

Реальные задачи - не учебные. Каждый кейс: конкретная проблема, принятые решения и измеримый результат.

  1. Архитектурная эволюция Маркетплейса

    Задача

    Legacy-монолит с циклическими зависимостями. Релизный цикл - 2 недели из-за сложности рефакторинга.

    ОШИБКИ ПРИ ЗАКАЗЕ
    было 12%, стало 0.1%
    ЦИКЛ РЕЛИЗА
    было , стало
    Решение

    Переход на FSD, изоляция бизнес-логики. Миграция с Redux на Zustand. Стейт-машины для оформления заказа.

  2. Личный кабинет бренда

    Задача

    Запуск полнофункционального личного кабинета с нуля за 2 рабочих дня.

    СРОК ЗАПУСКА
    2 дня
    ГОТОВНОСТЬ
    100%
    Решение

    shadcn/ui + Zod-валидация реактивных форм. Система нотификаций реализована за считанные часы до старта.

  3. UI-кит с нуля

    Задача

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

    КОМПОНЕНТОВ
    20+
    ДУБЛИРОВАНИЯ
    было было, стало нет
    Решение

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

  4. Лендинг для малого бизнеса

    Задача

    Небольшой бизнес без сайта. Нужен был быстрый запуск, без лишнего - только суть.

    LIGHTHOUSE
    98
    ВРЕМЯ ЗАПУСКА
    3 дня
    Решение

    Вёрстка на Next.js с упором на скорость загрузки, оптимизацию и мобильную адаптацию. Никаких лишних библиотек и логики. Только то, что работает.

  5. Онбординг и соглашения для команды

    Задача

    Новые разработчики тратили несколько дней, чтобы разобраться в проекте. Соглашений не было, каждый писал по-своему.

    ОНБОРДИНГ
    было , стало
    СТИЛЬ КОДА
    единый
    Решение

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

  6. Адаптивный интерфейс под любой экран

    Задача

    Таблица с большим количеством данных отображалась только на десктопе. На мобильных - горизонтальный скролл и потеря данных.

    ПОДДЕРЖКА ЭКРАНОВ
    320px+
    JS ДЛЯ АДАПТИВА
    0 строк
    Решение

    Перестроил компонент: на мобильных - карточки, на десктопе - таблица. CSS без JS, переключение через media query.

  7. Оптимизация загрузки страницы

    Задача

    Страница с тяжёлыми компонентами грузилась медленно. LCP выше 4 секунд - плохо и для пользователя, и для SEO.

    LCP
    было 4.1с, стало 1.3с
    LIGHTHOUSE
    было 61, стало 97
    Решение

    Lazy loading компонентов, code splitting, оптимизация изображений через next/image. Убрал блокирующие запросы на старте.

  8. Авторизация и защита маршрутов

    Задача

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

    УЯЗВИМЫХ РОУТОВ
    было 12, стало 0
    СЛОЁВ ЗАЩИТЫ
    3
    Решение

    JWT + refresh-токены, protected routes через middleware. Логика хранения токенов вынесена отдельно от UI.

  9. Многоязычность (i18n)

    Задача

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

    ЯЗЫКОВ
    3
    СТРОК ХАРДКОДА
    было 200+, стало 0
    Решение

    Перевёл строки в JSON-файлы, подключил next-intl. Организовал структуру переводов так, чтобы их мог обновлять не только разработчик.

  10. Доступность по стандартам WCAG 2.1

    Задача

    Интерфейс не работал с клавиатурой и скринридером. Часть пользователей просто не могла им пользоваться.

    A11Y ОШИБОК
    было 34, стало 2
    WCAG
    AA
    Решение

    Добавил ARIA-атрибуты, настроил фокус-менеджмент, исправил контраст. Прошёлся по ключевым сценариям с axe-core и вручную.