E-commerce

This is a fullstack e-commerce system with separate frontend and admin panel. It allows users to browse products, add them to the cart, and place orders, while administrators can manage orders, products, and more.

Tech Stack

Frontend (ecommerce-front)

• Next.js — React framework for SSR/SSG rendering.
• Styled Components — CSS-in-JS for scoped, component-based styling.
• Axios — Promise-based HTTP client for API requests.
• Mongoose for MongoDB (used via API) — MongoDB ODM used for data modeling.
• Stripe — Payment processing for secure online transactions.

Admin Panel (ecommerce-admin)

• Next.js
• NextAuth.js — Authentication with MongoDB session support.
• Mongoose for MongoDB
• AWS S3 SDK + multiparty — File uploads and cloud storage.
• Tailwind CSS — Utility-first CSS for rapid UI development.
• React SweetAlert2 — Custom modals and alerts.
• React SortableJS — Drag-and-drop list sorting.
• React Spinners — Lightweight loading indicators.

Live Demo

• Frontend (customer site): front-ang3lfco.vercel.app
• Admin Panel (not accessible without permissions): admin-ang3lfco.vercel.app

Fast Live Demo (GIF Showcase)

Customer View:

Cart & Checkout:

Admin Dashboard: