Кейс03 / 06
Maximum
Магазин электроники · витрина + админка
В RocketSEO я основной front-end разработчик витрины maximum.md и её админки. Довожу фичи от задачи до продакшена, во многом самостоятельно.
- Роль
- Middle Front-end Developer
- Период
- март 2026 – сейчас
- Контекст
- Агентство · RocketSEO
- Формат
- Гибрид · Кишинёв
- Next.js 14 App Router
- TypeScript strict
- Apollo Client
- apollo-link-rest
- next-intl
- SCSS Modules
- Mantine
- React Bootstrap
- Formik + Yup
- Jest + RTL
Задача
Maximum входит в число ведущих ритейлеров электроники в Молдове, у него большой каталог на румынском и русском. Витрина и админка написаны на Next.js 14 поверх REST-бэкенда. Я постоянно выпускаю фичи для оформления заказа, поиска и админки, и при этом нельзя ломать большую строго типизированную кодовую базу, в которой работают и другие разработчики.
- Оформление заказа с доставкой и самовывозом, которое удобно проходить с телефона
- Фильтры поиска, которые показывают, сколько товаров останется после выбора
- Инструменты админки, чтобы команда вела заказы, баннеры и SEO без разработчика
Что я сделал
Оформление заказа
- Шаги доставки и адреса выполняются по порядку, поэтому изменённое поле не теряется.
- Для самовывоза магазины загружаются под текущую локаль, а в селекторе виден адрес магазина.
- Страницы статуса оплаты с локализованными текстами корзины и чекаута.
- Локализованный выбор даты (RO/RU, неделя начинается с понедельника) и маска телефона во всех формах заказа. Ошибки появляются только после неудачной отправки.
- Кнопка предзаказа связана с формой быстрого заказа.
- Восстановление просроченной корзины и исправление дублей заказов при оформлении.
Фасетный поиск
- Перевёл поиск на новый бэкенд фильтрованного поиска с фильтром по категориям и счётчиками фасетов, которые обновляются сразу.
- Счётчики по опциям характеристик и по статусам на панели фильтров, локализованные фильтры с подсказками.
- Количество товаров в категории берётся из общего итога списка, а при первой загрузке из данных фасетов. Поля цены валидируются.
- Сортировка в результатах поиска, бренд как полноценный фильтр и переделанный выпадающий поиск в шапке с быстрыми фильтрами.
Админка
- Список и карточка заказа, создание и удаление заказов.
- Файловый менеджер, написанный с нуля, с папками, поиском и миниатюрами.
- Баннерные зоны с фильтрацией, промо-ссылки, настройки сайта с SEO-полями.
Дизайн-система и общие компоненты
- Цветовые токены для рамок, состояний и ховеров. Все захардкоженные цвета перевёл на них, и светлая и тёмная темы теперь берутся из одной палитры.
- Инлайн-стили перенёс в CSS Modules и описал правила в коротком документе UI-контракта, чтобы вся команда делала одинаково.
- Одна пагинация на всех страницах списков, одна стрелка прокрутки для каруселей и таблиц, фокус для клавиатуры в пагинации и подсказках.
- Страница сравнения заново собрана для десктопа и телефона с закреплённой первой колонкой, а на телефоне меню каталога открывается на весь экран.
SEO, кабинет и мобильная вёрстка
- Open Graph и мета-теги для товаров, категорий, брендов и главной, H1 и заголовки для избранного и сравнения.
- Мобильная вёрстка категорий, товара, корзины, чекаута, главной и поиска. Бургер-меню, новый дропдаун каталога и новая модалка кредита.
- В кабинете покупателя появились адреса, восстановление аккаунта, восстановление пароля с вводом кода и недавно просмотренные товары.
Результат
- коммитов с марта 2026
- 150+
- области на мне (чекаут, поиск, админка, дизайн-система)
- 4
- локали, RO и RU
- 2
Работаю в команде, но во многом самостоятельно. Фичи проходят через pull request в строгую TypeScript-кодовую базу с тестами на Jest и React Testing Library, и я обновляю тесты вместе с компонентами, которые меняю.
Чекаут и поиск
Обе фичи влияют на деньги и конверсию, поэтому больше всего работы ушло на состояние и пограничные случаи, а не на вёрстку. Доступ к данным устроен по принятой в проекте схеме операция → репозиторий → хук → компонент, Apollo Client работает поверх REST.