Skip to content

shivdevwalia/alibaba-fullstack

Repository files navigation

f# πŸ›’ Alibaba E-Commerce Platform (Full Stack)

A full-stack, role-based e-commerce platform inspired by Alibaba. Built using the MERN stack, it features authentication (including Google Sign-In), an admin dashboard, dynamic product management, real-time stock updates, email integration, and CAPTCHA-protected contact forms.


🌐 Live Demo

πŸ”— Frontend (React)
πŸ”— Backend API (Express)


πŸ› οΈ Tech Stack

Frontend:

  • React
  • Chakra UI
  • Redux (with Thunk)
  • React Router

Backend:

  • Node.js + Express
  • MongoDB + Mongoose
  • Bcrypt + JWT + Google OAuth
  • Nodemailer for emails

βœ… Features

πŸ‘₯ Authentication

  • Sign up / log in with email and password (bcrypt)
  • Google Sign-In integration
  • JWT-based route protection
  • Role-based access (admin vs customer)

πŸ›οΈ E-Commerce Functionality

  • View products with attributes (images, attributes, stock, price)
  • Search products by name with real-time filtering and Debouncing
  • Filter products by price range
  • Add to cart and checkout
  • Cart synced with localStorage
  • Checkout updates stock in real-time

πŸ§‘β€πŸ’Ό Admin Dashboard

  • Add, edit, and delete products
  • Manage product attributes (images, attributes, SKU, stock, price)
  • View and manage all orders placed
  • Edit About page content directly from the dashboard

πŸ“§ Contact & Emails

  • Contact form with CAPTCHA verification
  • Sends confirmation email to user
  • Sends submitted message to admin
  • Built with Nodemailer

πŸ“ Folder Structure

/Alibaba
  /backend    # Express backend  
  /frontend   # React frontend

πŸ“Έ Screenshots

🏠 Homepage

Landing page showing navbar, banners, and product highlights.
Homepage


πŸ›οΈ Product Listing Page

Users can browse, search, and filter products by price.
Product Listing


πŸ“„ Individual Product Page

Detailed view with product variants, description, stock, and Add to Cart.
Product Details


πŸ›’ Cart Page

Cart with selected items, total price, and checkout button.
Cart


πŸ” Sign-In Page

Login with email/password or Google account.
Sign In


πŸ§‘β€πŸ’Ό Admin Dashboard

Access to manage products, stock, and orders.
Admin Dashboard


πŸ“¦ Orders Management (Admin)

Admin can view and manage placed orders.
Orders


πŸ“ Edit About Us Page

Admin can update About Us content from the frontend.
Edit About


βœ‰οΈ Contact Form with CAPTCHA

CAPTCHA-protected contact form with email notifications.
Contact Form

About

A full-stack Alibaba-style e-commerce platform with real-time stock updates, Google Sign-In, admin dashboard, and secure checkout.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors

Languages