Интернет-магазин Gifty (SPA, React, TypeScript, MUI) (live version)

Интернет-магазин подарков и игрушек на TypeScript + React (frontend и backend) + Material UI в формате SPA с server-side rendering + собственный сервер изображений на основе sharp. React+Redux, TypeScript, Express server, MongoDB Atlas, Webpack. MongoDB full-text search с autocomlete для поиска по сайту + поисковые подсказки для ввода адреса и имени пользователя (dadata api).

Что интересного:

Frontend:
✅ кастомный конструктор адаптивных баннеров (поддерживаются 3 различных кастомизируемых шаблона баннеров)
✅ кастомные горизонтальные галереи single-item (карусель баннеров) и multiple-item (список товаров)
✅ полноценно функционирующая система связанных фильтров, в т.ч. диапазоны цен с управлением слайдером или текстовым вводом с парсингом параметров из url + сортировка
✅ алгоритм поиска похожих и рекомендованных товаров (на основе названия, категории и цены товара)
✅ трехэтапная корзина на одной странице (корзина - форма оформления заказа - TYP)
✅ поиск по сайту с подсказками запросов и товаров + автодополнение полей формы (имя и адрес)
✅ личный кабинет пользователя (статистика, заказы, управление личными данными)
✅ MUI + MUI styled-components
✅ кастомизированные управляемые Yandex.Maps
✅ React Spring анимации и parallax-эффект
✅ Optimistic UI + превью плейсхолдеры для контента во время загрузки данных
✅ Redux state sync + React Scroll Restoration

Backend:
✅ модуль авторизации (argon2, jwt, хранение токена в httpOnly signed Cookies), неявная регистрация/авторизация
✅ корзина, избранное и заказы хранятся в БД (MongoDB Atlas)
✅ кастомный мини-сервер изображений на основе sharp (конвертация изображений в нужный размер и формат с проверкой поддержки браузером webp)
✅ формирование хлебных крошек "на лету", парсинг параметров фильтрации товаров из url + загрузка данных из БД в едином middleware
✅ хранение просмотренных пользователем товаров, популярность товаров (на основе просмотров, добавлений в корзину и заказов)

Технологии

✅ React + Redux Toolkit
✅ TypeScript
✅ Material UI
✅ React Spring, sharp, react imask
✅ NodeJS, express server
✅ argon2, jwt
✅ MongoDB Atlas
✅ Yandex.Maps api, dadata api
✅ Webpack