🛒 Carrito de Compras con React

Aplicación de carrito de compras desarrollada con React y Vite, que permite visualizar productos, agregarlos al carrito, modificar cantidades y realizar una compra simulada.

---

🚀 Características

• 📦 Listado de productos
• 🔍 Búsqueda de productos
• ➕ Agregar productos al carrito
• ➖ Aumentar / disminuir cantidad
• 🗑️ Eliminar productos del carrito
• 💰 Cálculo del total de compra
• 🧾 Página de resumen de compra
• 🔄 Estado compartido entre componentes
• ⚡ Desarrollo rápido con Vite

---

🛠️ Tecnologías utilizadas

• React
• Vite
• JavaScript
• CSS

---

📂 Estructura del Proyecto

src/
│
├── Components/
│   ├── Product.jsx
│   ├── ProductosCart.jsx
│   ├── CounterProducto.jsx
│   ├── Encabezado.jsx
│
├── Pages/
│   ├── Page.jsx
│   ├── Carrito.jsx
│   ├── CompraRealizada.jsx
│
├── data/
│   └── productos.js
│
├── App.jsx
└── main.jsx

---

⚙️ Instalación

Clonar el repositorio:

git clone https://github.com/tu-usuario/react-shopping-cart.git

Entrar al directorio del proyecto:

cd react-shopping-cart

Instalar dependencias:

npm install

Ejecutar el servidor de desarrollo:

npm run dev

---

🖥️ Uso

1. Visualizar productos disponibles
2. Agregar productos al carrito
3. Modificar cantidades
4. Eliminar productos del carrito
5. Ver resumen de compra
6. Finalizar compra

---

🛒 React Shopping Cart

A simple and modern shopping cart application built with React and Vite. Users can browse products, add them to a cart, modify quantities, and complete a purchase.

---

🚀 Features

• 📦 Product listing
• 🔍 Product search
• ➕ Add products to cart
• ➖ Increase / decrease quantity
• 🗑️ Remove products from cart
• 💰 Calculate total price
• 🧾 Purchase summary page
• 🔄 Shared state between components
• ⚡ Fast development with Vite

---

🛠️ Built With

• React
• Vite
• JavaScript
• CSS

---

📂 Project Structure

src/
│
├── Components/
│   ├── Product.jsx
│   ├── ProductosCart.jsx
│   ├── CounterProducto.jsx
│   ├── Encabezado.jsx
│
├── Pages/
│   ├── Page.jsx
│   ├── Carrito.jsx
│   ├── CompraRealizada.jsx
│
├── data/
│   └── productos.js
│
├── App.jsx
└── main.jsx

---

⚙️ Installation

Clone the repository:

git clone https://github.com/your-username/react-shopping-cart.git

Go into the project directory:

cd react-shopping-cart

Install dependencies:

npm install

Run the development server:

npm run dev

---

🖥️ Usage

• Browse available products
• Add items to the cart
• Modify product quantity
• View cart summary
• Complete purchase

---

📸 Screenshots

---