🛍️ React Shop Application A simple E-Commerce Shop Demo Website built using React and Vite. This project demonstrates a shopping platform with product categories, cart, wishlist, and responsive UI.
🚀 Features 🏠 Landing Page with categories 👕 Men’s and Women’s product pages with images ❤️ Wishlist page 🛒 Cart page (shows empty cart message if no items) 🔔 Demo Alerts (e.g., login alert) 📱 Responsive design with media queries for mobile support 🖼️ Custom components like: Header Footer AlertMessage ShopButton SlidingImages
🛠️ Tech Stack ⚛️ React 18 ⚡ Vite (fast bundler and dev server) 📦 React Router DOM for navigation 🎨 CSS for styling 📂 Project structured with components, pages, data, and icons
📂 Project Structure src/ ├── components/ # Reusable UI components (Header, Footer, etc.) │ ├── css/ # Component-level CSS │ └── *.jsx ├── Data/ # Static product/category data & images ├── icons/ # SVG icons (cart, wishlist, etc.) ├── pages/ # Main app pages (Cart, Wishlist, Mens, Womens, Products) │ ├── css/ # Page-level CSS │ └── *.jsx ├── App.jsx # Root app component ├── Layout.jsx # Layout wrapper └── index.jsx # Entry point
⚙️ Installation & Setup Follow these steps to run the project locally:
-
Clone the repo git clone https://github.com/Tushar-Deshwal-tech/React-Shop-Application.git cd react-shop-application
-
Install dependencies npm install
-
Run development server npm run dev
-
Open in browser:
http://localhost:1234
📦 Build for Production To build the app for deployment: npm run build
To preview the production build locally: npm run preview
🧪 Testing This project includes testing setup with Vitest and React Testing Library.
Run tests: npm run test
🔮 Future Improvements Add authentication & user accounts Integrate a real backend (Node.js, Express, or Firebase) Add payment gateway (Stripe/PayPal demo) Improve product filtering & sorting
📜 License This project is licensed under the MIT License – feel free to use and modify.