React E-Commerce Store 🛒

A modern and responsive e-commerce web application built using React.
This project demonstrates clean component architecture, category-based product pages, and dynamic routing using React Router.

---

🚀 Features

• Home page with featured sections
• Category-wise product pages (Laptops, Mice, Keyboards, Monitors, Headphones)
• Reusable Product Card component
• Dynamic product detail pages
• Cart and Checkout pages
• Common layout with Navbar and Footer
• Clean, modular, and scalable folder structure

---

🛠️ Tech Stack

• React
• React Router DOM
• Vite
• Tailwind CSS
• Node.js
• JavaScript (ES6+)
• CSS

---

📂 Project Structure

src/
├── Components/
│   ├── Navbar.jsx
│   ├── Footer.jsx
│   ├── ProductCard.jsx
│   └── Layout.jsx
│
├── Pages/
│   ├── Home.jsx
│   ├── ProductList.jsx
│   ├── ProductDetail.jsx
│   ├── Laptops.jsx
│   ├── Mice.jsx
│   ├── Keyboards.jsx
│   ├── Monitors.jsx
│   ├── Headphones.jsx
│   ├── Cart.jsx
│   └── Checkout.jsx
│
├── data/
│   └── products.js
│
├── App.jsx
├── main.jsx
└── index.css

---

🔁 Routing Overview

• / → Home
• /products → All Products
• /product/:id → Product Details
• /laptops → Laptop Category
• /mice → Mice Category
• /keyboards → Keyboards Category
• /monitors → Monitors Category
• /headphones → Headphones Category
• /cart → Cart Page
• /checkout → Checkout Page

---

▶️ Getting Started

1. Clone the repository

git clone https://github.com/Harshitshrivas/Tech-Hub.git

2. Install dependencies:

npm install

3. Start development server

npm run dev

📌 Future Enhancements

• Add backend integration
• Implement authentication
• Payment gateway integration
• Product filtering and search
• Order history

👨‍💻 Author

• Harshit Shrivas
• Aspiring Software Developer
• React | Java | DSA

⭐ If you like this project, don’t forget to star the repository!