Написать приложение, которое содержит три страницы:
- страница со списком категорий и продуктов
- страница продукта
- страница корзины
Данные магазина нужно брать, с помощью Ecwid REST API
Проще всего использовать демо-магазин, данные такие:
- StoreID: 58958138
- Token: public_7BxbJGWyDaZfSQqjVS5Ftr4jzXkS43UD
Страница содержит список товаров и категорий в любом удобном виде: сетка, список таблица. Данные для отображения категории:
- название категории
- изображение категории
- название товара
- цена товара
- изображение товара
- кнопка «Купить»
При нажатии на категорию приложение переходит на страницу с подкатегориями и товарами, принадлежащими этой категории.
При нажатии на товар приложение переходит на страницу «Детали товара».
Страница содержит детали о товаре:
- названием товара
- описание товара
- изображение товара
- цена товара
- кнопка «Купить»
Кнопка добавляет товар в «корзину» Корзина - любое локальное хранилище со списком добавленных товаров.
На всех страница отображается иконка корзины с количеством товаров, добавленных в нее. При нажатии на иконку приложение переходит на страницу «Корзина»
Страница содержит список добавленных товаров и кнопку «Оформить заказ». Любой товар в списке можно удалить по нажатию на кнопку «Удалить».
Состояние страницы отображается в url'е. При переходе по url'е отображается та страница, которая принадлежит этой url'е.
При нажатии на кнопку показывается текст с поздравлением о покупке.
- Typescript
- VueJS
- HTML/CSS
- слайдер картинок товаров не работает (вынести слайдер в отдельный компонент)
- не реализованы вложенные категории
- на любой странице получаем данные всех категорий/продуктов, это не оптимально, все данные не нужны на каждой странице
- добавить прелоадер
Страницы должны выглядеть приятно и читаемо. Можно воспользоваться любым CSS framework'ом.