Skip to content

This project is a frontend implementation of a dessert shop application focusing on product listing and cart management functionalities. It replicates core features found in e-commerce platforms like Amazon or Flipkart, showcasing how products are displayed and managed within a shopping cart ๐Ÿ›’.

Notifications You must be signed in to change notification settings

Aayush259/Product-listing-with-cart

Folders and files

NameName
Last commit message
Last commit date

Latest commit

ย 

History

27 Commits
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 

Repository files navigation

๐Ÿฐ Dessert Shop - Product Listing and Cart Management

This project is a frontend implementation of a dessert shop application focusing on product listing and cart management functionalities. It replicates core features found in e-commerce platforms like Amazon or Flipkart, showcasing how products are displayed and managed within a shopping cart ๐Ÿ›’.

๐ŸŒŸ Features

  • Product Listing: Displays a variety of desserts fetched from a JSON data source.
  • Cart Management: Allows users to add, remove, and views items in the cart.
  • Order Confirmation: Provides a streamlined checkout process with an order confirmation window.

๐Ÿ› ๏ธ Technologies Used

  • React
  • Tailwind CSS ๐ŸŒˆ
  • Context API

๐Ÿ“ Implementation Details

Product Listing

The DessertContainer components fetches dessert data dynamically from a JSON file and renders each dessert item using the DessertCard component. It employs responsive design principles to optimize display across different screen sizes.

Cart Management

The Cart component manages cart items (cartItems) and calculates the total order price (totalOrderPrice). Users can add or remove items from the cart, and upon order confirmation, the cart state is reset.

User Interaction

  • AddToCartButton allows users to increment or decrement item quantities in the cart.
  • OrderConfirmedWindow displays a confirmation message after the order is placed, with options to start a new order.

๐Ÿ–ผ๏ธ Screenshots

Cart Management Order Confirmation

๐ŸŽ‰ Credits

This project is inspired by the Frontend Mentor challenge, focusing on frontend development skills and best practices.

๐Ÿ“ฌ Feedback and Suggestions

Your feedback is valuable! If you have any suggestions, ideas, or improvements for this project, please feel free to open an issue or submit a pull request. Your contributions are welcomed and appreciated ๐Ÿš€.

About

This project is a frontend implementation of a dessert shop application focusing on product listing and cart management functionalities. It replicates core features found in e-commerce platforms like Amazon or Flipkart, showcasing how products are displayed and managed within a shopping cart ๐Ÿ›’.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published