Gadget Heaven

Description

Gadget Heaven showcases a wide variety of products in different categories, allowing users to purchase what they need. Categories such as MacBooks, laptops, and more are available. When clicking on a category, users will see the products in that category. If a product is out of stock, a "No Data" message will be displayed. Clicking on a product will show all the details, and an "Add to Cart" button is available to add the product to the dashboard. Users can also add items to their wishlist, and later, they can move them to the cart. The site has many additional features, providing an engaging shopping experience.

React Fundamental Concepts Used

• React Router: Used for navigation between different pages.
• State Management: Handled using React's useState and Context API.
• Local Storage: For persisting data such as the cart and wishlist.
• React Hooks: useEffect for managing side effects.
• React Context API: For global state management like managing cart and wishlist.
• Dynamic UI: Changing UI based on page conditions (e.g., "No Data" message when no products are available).

What You Have Used for Handling and Managing Data

• Local Storage: Used for storing data like cart items and wishlist to maintain data even after the page reloads.

Features of Your Website/Project

1. NavBar Background Color: The background color of the NavBar will be sky blue on the homepage, and will turn white when navigating to other pages.
2. Fixed NavBar and Footer: Both NavBar and footer remain fixed while the inner content changes based on the current page.
3. Product Statistics: The statistics page shows the price and category for each product.
4. Delete Items from Dashboard: Each item in the dashboard has a delete button to remove it from the cart.
5. Sorting: The dashboard allows users to sort items by price, and the purchase button removes all items from the cart.

Installation

To get started with this project, follow these steps:

1. Clone the repository:

   git clone https://github.com/username/gadget-heaven.git

2. Install dependencies:

   npm install

Technologies Used

• localforage: "^1.10.0"
• match-sorter: "^7.0.0"
• react: "^18.3.1"
• react-dom: "^18.3.1"
• react-icons: "^5.3.0"
• react-router-dom: "^6.27.0"
• react-tabs: "^6.0.2"
• react-toastify: "^10.0.6"
• recharts: "^2.13.3"
• sort-by: "^1.2.0"

License

This project is licensed under the MIT License - see the LICENSE file for details.