https://github.com/balamurugan-annadurai/react-shopping-cart-redux

About A responsive shopping website built with React.js, featuring dynamic product management and an interactive shopping cart. Users can add, remove, and update product quantities, with real-time updates on total price and stock availability
https://github.com/balamurugan-annadurai/react-shopping-cart-redux

css3 html5 javascript jsx react

Last synced: about 2 months ago
JSON representation

About A responsive shopping website built with React.js, featuring dynamic product management and an interactive shopping cart. Users can add, remove, and update product quantities, with real-time updates on total price and stock availability

• Host: GitHub
• URL: https://github.com/balamurugan-annadurai/react-shopping-cart-redux
• Owner: balamurugan-annadurai
• Created: 2024-08-15T07:45:13.000Z (5 months ago)
• Default Branch: main
• Last Pushed: 2024-08-20T03:23:34.000Z (5 months ago)
• Last Synced: 2024-10-19T02:35:27.902Z (3 months ago)
• Topics: css3, html5, javascript, jsx, react
• Language: JavaScript
• Homepage: https://redux-shopping-cart-bala.netlify.app/
• Size: 239 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# 🛒 Shopping Website

Welcome to the Shopping Website! This repository features a responsive web application built with React.js and powered by Redux and Redux Toolkit. It is designed to deliver a seamless shopping experience where users can effortlessly manage their cart. You can add and remove products, view and edit the cart contents, and receive real-time updates on the total price and product count. The application also tracks stock availability.

## ✨ Features

- 📱 **Responsive Design**: Optimized for various devices to ensure a smooth user experience across all platforms.

- ➕ **Add and Remove Products**: Easily manage products in the cart with simple add and remove actions.

- 🛍️ **Cart Management**: View and edit the number of products in your cart directly.

- ⚠️ **Stock Availability**: Receive notifications if your selected quantity exceeds available stock.

- 🔄 **Real-Time Updates**: Experience instant updates to cart contents without needing to refresh the page.

- 💰 **Total Price Calculation**: Automatically calculates and displays the total price and product count in the cart.

## 🛠️ Technologies Used

- ⚛️ **React**

- 🔄 **Redux**

- 🛠️ **Redux Toolkit**

- 🟨 **JavaScript**

- 🌐 **HTML**

- 🎨 **CSS**

## 🛠️ Usage

- **Adding Products**: Click the "Add to Cart" button to include a product in your cart.

- **Removing Products**: Click the "Remove" button to remove a product from your cart.

- **Editing Product Quantity**: In the cart, adjust the quantity of a product as needed. Notifications will appear if the desired quantity exceeds stock availability.

- **Viewing Cart**: Navigate to the cart to view added products, total price, and product count.

## 🤝 Connect with Me

💼 **LinkedIn:** [Balamurugan A](https://www.linkedin.com/in/balamurugan-a/)