Cтраница вывода списка товаров с возможностью сортировки товаров, добавления/удаления товаров в корзине.
Ознакомиться с приложением можно по ссылке.
- Первая страница проекта представляет из себя список товаров первой категории из имеющихся и выбранной первой категорией в списке (данные должны быть получены и отрисованы на сервере).
- Переключение между категориями, при этом список товаров обновляется в соответствии с выбранной категорией.
- Добавление в корзину и удаление из нее любого из представленных товаров, посредством нажатия соответствующего триггера на карточке товара, при этом иконка меняет свое состояния в зависимости от наличия данного товара в корзине.
- Открытие корзины в модальной панели по клику соответствующего триггера в шапке сайта.
- Просмотр пустой корзины.
- Просмотр корзины с товарами.
- Удаление из корзины товаров из списка по клику соответствующего триггера на карточке товара в корзине.
- Отправка заявки на исполнение заказа с валидацией и масками для соответствующих полей.
- Отображение блока удачной отправки заявки.
- Удаление товаров из корзины после удачной отправки заявки.
- Каждая категория реализована в отдельный странице посредствам Nested Routes.
- Содержимое корзины будет сохраняться, даже если пользователь закроет вкладку и снова зайдет на сайт.
# клонирование репозитория
$ git clone https://github.com/OctopussyO/news-explorer-frontend.git
# установка зависимостей
$ npm install
# запуск приложения в режиме разработчика
$ npm run start
# сборка проекта
$ npm run build
- Сверстать страницу ошибки.
- Добавить возможность поставить "звёздочку" товару.
- Добавить попапы с подтверждением при удалении товара из корзины.
- Доработать компонент формы (валидация, рефакторинг).
- Выделить компонент поля ввода с маской.
- Сделать адаптивную версию для мобильных устройств.