Delivered a complete end-to-end shopping and administration workflow
Preparing the next view...
Scatch / Case study
Scatch E-commerce & Demo Management Platform
Scatch is a production-ready full-stack e-commerce portfolio project with separate customer and administrator experiences. It includes cookie-based authentication, product and inventory management, cart and checkout workflows, order tracking, Cloudinary image uploads, and a protected demo-data reset system backed by MongoDB snapshots. The application is organized as a pnpm Turborepo and deployed as separate Next.js and Express services on Vercel.
- Company
- Scatch
- Role
- Full Stack Development
- Year
- 2026
- Duration
- Portfolio project
Scatch is a responsive full-stack commerce platform designed to demonstrate a complete customer purchase journey alongside practical store administration. Customers can authenticate, browse and filter products, manage a persistent cart, complete checkout, and review their orders. Administrators can securely manage products, stock, images, and order statuses. A protected snapshot-based reset feature restores the portfolio database to its curated baseline after public demo testing.
Next.js 16React 19TypeScriptExpress 5MongoDBMongooseTailwind CSS 4Turborepo
02 / Outcome
What changed after the work.
Created a reusable portfolio demo that can safely recover after visitor testing
Separated frontend and backend deployments while preserving secure credentialed requests
Built a responsive experience across mobile, tablet, and desktop layouts
03 / Engineering decisions
Challenge, implementation, outcome.
Challenge
Maintaining cookie-based authentication across separately deployed frontend and backend services
Implementation
Designed and developed the customer storefront and administrator interfaces
Outcome
Delivered a complete end-to-end shopping and administration workflow
Challenge
Keeping shared API contracts synchronized across the frontend, backend, and services package
Implementation
Implemented customer and owner authentication with secure HTTP-only cookies
Outcome
Created a reusable portfolio demo that can safely recover after visitor testing
Challenge
Implementing stock-aware cart updates and order creation without inconsistent inventory state
Implementation
Built reusable API services shared across frontend workflows
Outcome
Separated frontend and backend deployments while preserving secure credentialed requests
04 / System view
How the product moves.
App Router frontend + shared API service + REST backend
01Next.js UI
02Frontend API Proxy
03Express REST API
04Mongoose
05MongoDB Atlas
Core features
- Separate customer and administrator authentication flows
- Responsive product catalogue with collection, availability, discount, and price filters
- Persistent shopping cart with quantity, stock, discount, and total calculations
- Cash-on-delivery checkout with shipping-address validation
- Customer order history and detailed order tracking
- Administrator product creation, editing, deletion, and inventory management
- Administrator order dashboard with controlled status transitions
- Cloudinary-backed product image upload and delivery
My contribution
- Designed and developed the customer storefront and administrator interfaces
- Implemented customer and owner authentication with secure HTTP-only cookies
- Built reusable API services shared across frontend workflows
- Developed product, cart, checkout, order, and inventory features
- Integrated MongoDB Atlas for persistent application data
- Integrated Cloudinary for product image storage and delivery
- Created protected backup and demo-reset functionality
- Made the complete frontend responsive and touch friendly
Performance and quality
- Server-rendered product routes and optimized Next.js production builds
- Shared Axios service layer to avoid duplicated request logic
- Reusable MongoDB connection handling for serverless invocations
- Cloudinary-hosted media instead of database image payloads
- Responsive single-row product showcase with mobile scroll snapping
- Strict TypeScript validation across frontend and shared packages
- Next.js production build verification
Next case study
Sundarban