This is a shopping cart web application built with Vite, React, and TypeScript. It uses the Context API for state management and allows users to add items to a cart, view the cart, delete products, and increase/decrease the quantity of products.
To get started with this project, you can follow these steps:
- Clone the repository using
git clone. - Run
npm installto install the necessary dependencies. - Run
npm rundev to start the development server.
This shopping cart app has the following features:
- Add products to cart: Users can browse through the list of products and add them to the cart by clicking the "Add to Cart" button.
- View cart: Users can view their cart by clicking the "View Cart" button in the header. The cart displays the list of products, their prices, and the total cost.
- Delete products: Users can remove products from the cart by clicking the "Delete" button.
- Increase/decrease quantity: Users can increase or decrease the quantity of products from the options bar. The maximum quantity is 20.
- Place an order: Users can place an order by clicking the "Place Order" button in the cart. This clears the cart and displays a message confirming the order.
This shopping cart app is a simple example of how to use the Context API for state management in a React application. It also demonstrates how to use TypeScript to improve the reliability and maintainability of your code. With the features provided, users can easily browse products, add items to the cart, and place orders with just a few clicks.