Небольшое веб-приложение с карточками продуктов. Каждая карточка содержит изображение товара, его название и стоимость. Если товар со скидкой, старая цена отображается зачеркнутой, а новая выделена цветом.
src/assets
: содержит изображения товаровsrc/products.js
: список товаров магазинаsrc/main.jsx
: корень React-дерева
Проект создан с использованием Vite и React
- ProductList: основной компонент, отображающий список карточек продуктов
- ProductCard: компонент для отдельной карточки продукта
- Скидка на товар представлена относительным значением (discount от 0 до 1)
- Для отображения фотографии товара в карточке используется адрес изображения из директории
assets
- cкачайте репозиторий с приложением или склонируйте его с помощью команды:
git clone https://github.com/MashaMoreva/test-1.git
- перейдите в папку проекта:
cd test-1
- установите необходимые зависимости:
npm install
- запустите проект:
npm run dev
(приложение будет доступно по адресу http://localhost:5173/)