Merajul Haque
Full-Stack Developer
Full-Stack E-Commerce
SANAB Case Study & Specifications
Discover More. Shop Better. Access Instantly.
sanab.in
1 / 4
Full-Stack E-Commerce2026
SANAB
Discover More. Shop Better. Access Instantly.
A unified multi-category commerce platform combining fine jewellery, cosmetics, and instant-access digital product distribution.
Project Specifications
Category:
Full-Stack E-Commerce
Year / Release:
2026
Deployment Status:
Active / Production
License / Code:
Proprietary / On Request
Industry:
Jewellery, Cosmetics & Digital Commerce
Frontend Framework:
Next.js 16 (React 19, TypeScript)
Backend Framework:
Express.js 4 REST API (TypeScript)
Database & ODM:
MongoDB with Mongoose
State Management:
Redux Toolkit & React Redux
Background Processing:
BullMQ + Redis
Payment Integrations:
Razorpay & Stripe SDKs
Media Management:
Cloudinary
Email Delivery:
Nodemailer (Transactional)
Architecture:
Decoupled Frontend & REST API Backend
“One platform for products, possibilities, and digital experiences.”
About the Project
SANAB is a multi-category e-commerce platform combining physical product shopping with digital product distribution within a unified branded storefront. The platform brings together fine jewellery collections, beauty and cosmetics, and downloadable digital content in a cohesive shopping experience. The platform uses a modern Next.js 16 frontend backed by a separately maintained Express.js REST API. Its backend integrates MongoDB with Mongoose for data persistence, Redis-backed BullMQ job processing infrastructure for asynchronous workflows and retries, Cloudinary for cloud media management, dual payment gateway integrations with Razorpay and Stripe SDKs, and transactional email delivery via Nodemailer. SANAB is designed to support rich product discovery, customer shopping journeys, digital product delivery with dedicated seeding pipelines (seed-digital.ts), and the operational reliability needed to manage an expanding online commerce business.
Key Features & Engineering Highlights
Multi-Category Product Catalogue — Supports a unified storefront experience spanning fine jewellery, cosmetics, and downloadable digital products
Modern Frontend Architecture — Built with Next.js 16 and React 19, styled with Tailwind CSS 4, shadcn UI tooling, Base UI primitives, and Lucide React icons
Centralized State Management — Uses Redux Toolkit and React Redux for predictable, performant client-side state management
Modular REST API Backend — Dedicated Express.js 4 and TypeScript service with MongoDB and Mongoose ODM for scalable commerce data persistence
Background Job Processing — Robust BullMQ and Redis infrastructure for asynchronous jobs, retries, and queue-based workflows
Dual Payment Gateway Integration — Multi-provider checkout powered by Razorpay and Stripe SDKs for physical and digital merchandise
Digital Commerce & Instant Fulfilment — Dedicated delivery workflow for digital products with automated seeding scripts and instant content access
Cloud Media & Communications — Cloudinary integration for responsive media workflows and Nodemailer for transactional email delivery
API Security & Rate Limiting — Production-hardened with Helmet headers, CORS policies, express-rate-limit throttling, and Zod schema validation
Logging & Analytics Infrastructure — Winston application logging, Morgan HTTP request logs, Highcharts data visualization, Vercel Analytics, and Microsoft Clarity
System Architecture
High-Level Architecture Pipeline
Customer → Next.js 16 / React 19 Frontend → Express.js REST API → MongoDB / Mongoose
Redis + BullMQ
Background job queues and asynchronous task processing
Cloudinary
Responsive cloud media and digital asset management
Razorpay & Stripe
Multi-currency secure payment processing integrations
Nodemailer
Transactional email delivery for receipts and order confirmations
node-cron
Scheduled background tasks and digital product synchronization
Winston & Morgan
Comprehensive application logging and HTTP request auditing
Technologies & Architecture
Core frameworks, runtime technologies, databases, and UI libraries employed in this project.
Next.js 16React 19TypeScriptExpress.jsMongoDBMongooseRedux ToolkitTailwind CSS 4BullMQRedisRazorpayStripeCloudinaryNodemailerZod
Frontend Technologies
Next.js 16React framework and application routing
React 19Modern component-based user interfaces
TypeScriptStatic typing across components and data models
Tailwind CSS 4Modern utility-first styling and animations
shadcn & Base UIAccessible UI component primitives
Redux ToolkitCentralized client-side state management
Highcharts & ReactInteractive analytics and data visualization
Vercel Analytics & ClarityTraffic and user experience behavior monitoring
Backend & Infrastructure
Node.js & Express.js 4Modular REST API framework in TypeScript
MongoDB & MongooseDocument database and object modeling layer
BullMQ & RedisAsynchronous job queues and worker retries
Razorpay & Stripe SDKsMulti-provider payment gateway processing
CloudinaryCloud media storage and CDN optimization
NodemailerTransactional notifications and delivery emails
Helmet, CORS & Rate-LimitHTTP security headers, throttling, and origin control
Jest & SupertestAutomated backend testing and API integration tests
Experience SANAB Live
Explore the responsive interface, live workflows, and interact with the production deployment.
Open in New TabMore Projects in Portfolio
Explore other applications, productivity tools, and platforms
coldmailer.site
2
Cold Mailer
Write Once. Reach Many.
Find the right companies, personalize your outreach, and manage cold email campaigns with your own sending infrastructure.
Next.js 16React 19TypeScript+9
LiveWrite once. Reach many.
masjidmadarsafinder.com
5
MasjidMadarsaFinder
Connecting Communities with Islamic Institutions.
Discover mosques, find madrasas, and explore Islamic educational institutions through a unified digital platform.
Next.js 16React 19TypeScript+10
LiveConnecting communities with Islamic institutions.
orbit.merajulhaque.com
6
Orbit
Your personal productivity OS
Helps me plan, focus, and get things done. It works offline, syncs with Google Calendar, and brings tasks, notes, research, and career goals in one place.
Next.jsTypeScriptMongoDB+3
LiveAll your work, in orbit.
matchwize.com
5
Matchwize
AI-Powered Resume Analyzer
Upload your resume and get instant feedback, skill insights, and job matches. Used by 130+ job seekers to improve their resumes.
Next.jsTailwind CSSNode.js+3
LiveBetter opportunities ahead.
instierp.in
3
InstiERP
Institutional ERP & Campus Management System
Comprehensive ERP platform for universities and colleges managing student admissions, fees, faculty, timetable scheduling, and academic performance.
ReactNext.jsNode.js+3
LiveSeamless campus administration.
exceedrobotics.com
2
Exceed Robotics
Robotics Education & STEM Learning Platform
Interactive STEM learning portal for hands-on robotics education, course progression, workshop bookings, and student project showcases.
Next.jsTypeScriptTailwind CSS+2
LiveEmpowering future innovators.