https://github.com/ssmahim01/mz-shop
The project name is MZ Shop. The project has some routes where users can go through the click. It was built by using React Router, Tailwind CSS, Daisy UI those technologies. Suppose, it is a normal E-Commerce website.
https://github.com/ssmahim01/mz-shop
javascript react-router reactjs tailwind-css
Last synced: 3 months ago
JSON representation
The project name is MZ Shop. The project has some routes where users can go through the click. It was built by using React Router, Tailwind CSS, Daisy UI those technologies. Suppose, it is a normal E-Commerce website.
- Host: GitHub
- URL: https://github.com/ssmahim01/mz-shop
- Owner: ssmahim01
- Created: 2024-11-11T19:35:12.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2025-01-12T12:14:16.000Z (over 1 year ago)
- Last Synced: 2025-03-01T23:34:57.013Z (over 1 year ago)
- Topics: javascript, react-router, reactjs, tailwind-css
- Language: JavaScript
- Homepage: https://the-gadget.netlify.app
- Size: 654 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Project Name
Gadget Heaven
# Live Link
Live Of The Project: https://the-gadget.netlify.app/
# Requirement Document Link
DOC Link: https://github.com/ProgrammingHero1/B10-A8-gadget-heaven/blob/main/Batch-10_Assignment-08.pdf
# React Fundamental Concepts
Props: Props is short for "properties". Props are used to pass data parent component to child components for communication and data flow.
State Management: React's (useState) hook is used to manage local component state for items in the cart and wishlist.This allows dynamic updates cart and wishlist items based on user actions.
Hooks: Special functions like (useState, useEffect) that let me manage state and side effects in functional components.
Conditional Rendering: Conditional Rendering can be used for show or hide components. Rendering different UI elements based on certain conditions.
Event Handling: Event handlers are used for actions like adding items to the cart and wishlist, Deleting items from the cart and wishlist.
# Handling and Managing Data
Local State (useState): For managing the cart and wishlist items within the Dashboard component.
Props Drilling: Used for pass data to components or others then used.
Local Storage: Used Local Storage to stored data then manage.
# 5 Features of the Project
Navigate and Navigation: Used Navigate for manage path to go one page to another page. And used Navigation for control loading.
Cart and Wishlist Management: Users can add items to the Cart or Wishlist from Product Details.
Quantity and Total Price Control in Cart: Users can increase and decrease the quantity of each item in the Cart.Total Price will be automatically calculated and displayed based on the items and quantities.
Data Storage: Cart and Wishlist data will be saved in local storage, so users can return to their items even after a session ends.
Filtering and Sorting: Users can filter products by category or other criteria to find specific items.Sorting options based on price.Users can click the Sort by Price button then sort the items by price in descending order.
# Setup
This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.
Currently, two official plugins are available:
- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react/README.md) uses [Babel](https://babeljs.io/) for Fast Refresh
- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh