eCommerce Web Application

📖 Overview

This is a full-featured, scalable E-commerce platform built with the MERN stack (MongoDB, Express, React, Node.js). Designed to deliver a seamless shopping experience, the app supports user authentication, product browsing, cart management, order processing, and admin controls for product and order management.

From responsive UI to secure checkout flows, the application mimics the architecture and performance expected from real-world online stores.

🧠 Why I Built It

E-commerce is one of the most widely-used domains in web development. I developed this app to gain mastery in building a production-ready, customer-centric application, where backend logic, secure transactions, and UI responsiveness are all essential.

This also challenged me to design real-world UX patterns (like filtering, pagination, and user dashboards) and manage state across multiple components effectively.

🔍 Key Features

👤 User Authentication

• Register, login, logout

• Secure JWT-based authentication

• Role-based access (User vs Admin)

• Forgot password (via email - optional scope)

🛍️ Product Management

• Browse products by category, search, or keyword

• Pagination and filtering for scalability

• Product detail page with full info and images

• Admins can add, edit, delete products via a protected dashboard

🛒 Cart & Checkout

• Add products to cart

• Update quantities, remove items

• Checkout flow with shipping details, order summary, and confirmation

• Order placement and persistence in database

📦 Order Management

• Users can view their order history

• Admins can view, update, or fulfill orders

• Order status updates (pending, shipped, delivered)

📊 Admin Dashboard

• Full control panel for managing:

  • Products

  • Orders

  • Users

  • Categories

• Search and filter functionalities

• Modal-based UI for CRUD actions

💡 Additional Features

• Wishlist or save-for-later functionality (optional)

• Responsive layout for mobile/tablet/desktop

• Light/Dark mode toggle using ShadCN UI

🧑‍🎨 Frontend Excellence

• Built with React + TypeScript + Vite for lightning-fast development

• Tailwind CSS and ShadCN UI for mobile-first, elegant UI

• Route-based rendering with React Router & layout structure

• State managed via React hooks and local storage

🛠 Tech Stack