- 🔐 Secure Authentication - User registration and login with role-based access
- 🔍 Advanced Search - Search products by name, category, brand, and SKU
- 🏷️ Dynamic Categories - Multi-level category and subcategory navigation
- 📦 Product Variants - Multiple variants per product (size, color, specifications)
- 🎥 Video Integration - Product videos with popup player
- 💰 Price Visibility - Login-required pricing system
- 🛍️ Shopping Cart - Real-time cart management
- 📱 Responsive Design - Mobile-first, works on all devices
- 🌙 Dark Mode - Beautiful dark theme support
- 📊 Dashboard - Comprehensive admin dashboard
- ➕ Product Management - Create, edit, delete products with variants
- 🖼️ Media Management - Bulk image upload and video integration
- 📂 Category Management - Create hierarchical categories and subcategories
- 👥 User Management - Manage customers and staff
- 📦 Order Management - Track and manage orders
- 🎯 Brand Management - Organize products by brands
- 🏷️ Banner Management - Dynamic hero banners with carousel
- 📝 Order Creation - Create orders for customers
- 💵 Quotation System - Generate and manage quotations
- 📊 Sales Dashboard - Track sales performance
- 👤 Customer Management - Manage customer information
- ⚡ Next.js 14 - React framework with App Router
- 🎨 Tailwind CSS - Utility-first CSS framework
- 📘 TypeScript - Type-safe development
- 🔄 Zustand - State management
- 🎯 React Hot Toast - Beautiful notifications
- 🎭 React Icons - Icon library
- 🚀 Node.js - JavaScript runtime
- ⚡ Express.js - Web framework
- 🗄️ Prisma ORM - Database toolkit
- 💾 SQLite - Database (easily switchable to PostgreSQL/MySQL)
- 🔐 JWT - Authentication
- 📁 Multer - File upload handling
project-ades/
├── frontend/ # Next.js Frontend
│ ├── src/
│ │ ├── app/ # App Router pages
│ │ │ ├── admin/ # Admin panel
│ │ │ ├── sales/ # Sales dashboard
│ │ │ ├── products/ # Product pages
│ │ │ └── ...
│ │ ├── components/ # Reusable components
│ │ ├── store/ # Zustand stores
│ │ └── lib/ # Utilities
│ └── public/ # Static assets
│
├── backend/ # Express.js Backend
│ ├── src/
│ │ ├── routes/ # API routes
│ │ ├── middleware/ # Auth, upload, etc.
│ │ └── index.ts # Server entry
│ ├── prisma/ # Database schema
│ └── uploads/ # Uploaded files
│
└── products_store_format.json # Product import data
This is a client project developed for a hardware and tools e-commerce business. The platform provides a complete solution for managing products, orders, and customer interactions with a modern, user-friendly interface.
- Clean, professional UI/UX design
- Responsive design for all devices
- Dark mode support
- Smooth animations and transitions
- Streamlined product management with variants
- Efficient order processing system
- Role-based access control for team management
- Enhanced customer experience with advanced search and filtering
- Hierarchical categories and subcategories
- Hover-based navigation menu
- Category-based product filtering
- Multiple variants per product
- Variant-specific pricing
- Attribute-based variants (size, color, etc.)
- Individual SKUs for each variant
- Multiple images per product
- Bulk image upload
- Vertical thumbnail navigation
- YouTube video embedding
- Popup video player
- Multiple videos per product
- Admin: Full system access
- Salesman: Order and quotation management
- Customer: Browse and purchase
- ✅ Successfully delivered a complete e-commerce solution
- ✅ Implemented complex product variant system
- ✅ Built intuitive admin panel for easy management
- ✅ Achieved responsive design across all devices
- ✅ Integrated advanced features like image zoom and video playback
- ✅ Optimized performance for fast loading times
Devil
Full-Stack Developer | DevilBytes
- Portfolio: devilbytes.com
- Specialization: E-Commerce Solutions, Full-Stack Development
This is a client project developed for portfolio showcase purposes. The actual implementation may contain proprietary business logic and configurations that are not included in this repository.
For similar projects or custom development inquiries, visit devilbytes.com

