Shopping-state depth
Wishlists, carts, cookie-authenticated sessions, and MongoDB user state make the product stronger than a purely visual store mockup.
Back to projects
Retail commerce case study
Lizz-Shop
Full-stack retail commerce platform with JWT sessions, cart and wishlist persistence, merchandising bands, and variant-aware browsing
Lizz-Shop is a full-stack e-commerce platform built with a dedicated web frontend and backend service architecture. The storefront covers product discovery, category browsing, search, detailed product pages, size and color variants, wishlists, carts, and user account behavior. The backend uses Node.js, Express, MongoDB, Mongoose, JWT-based auth, and cookies to maintain user-specific cart and wishlist state. On top of core shopping behavior, the project includes merchandising sections such as new arrivals, trending products, and BOGO-oriented presentation, which makes it feel closer to a real retail storefront than a catalog demo.
I built Lizz-Shop as a practical commerce system focused on shopping-state correctness, user-specific persistence, variant-aware product behavior, and a storefront experience that feels more real than a static template.
Split frontend and backend
Next.js storefront and Express-backed APIs show full-stack separation instead of a frontend-only build
JWT plus cookies
Authenticated user sessions are persisted through protected flows instead of local-only temporary state
Cart and wishlist persistence
Shopping intent is stored per user in MongoDB-backed models rather than lost on refresh
Variant-aware products
Size and color options are part of the product detail flow, which adds realism to the shopping experience
Merchandising sections
New arrivals, trending, and BOGO APIs make the storefront feel curated and commercially structured
Search and category browsing
Discovery behavior is broader than a single landing page with fixed products
System proof
What gives the storefront real product depth
Variant-aware browsing
Product detail pages handle size and color selections so the purchase flow feels closer to real retail behavior.
Merchandising logic
New arrivals, trending sections, and BOGO-oriented APIs show that the project includes merchandising thinking, not only CRUD data rendering.
Full-stack separation
A dedicated backend service with JWT and cookies proves this is structured more like an actual application stack than a frontend-only prototype.
Product discovery
Customers can browse categories, search for products, inspect collections, and move through merchandising-led storefront sections instead of only a single static catalog page.
Variant and detail handling
Product pages support variant-style choices such as size and color, helping the store behave more like an actual fashion or retail shopping experience.
Authenticated shopping state
JWT-backed sessions and cookies connect the frontend to user-specific cart and wishlist data, which gives continuity across visits and refreshes.
Wishlist and cart persistence
User intent is stored in backend models so saved products and cart contents are not limited to local browser state alone.
Merchandising API surface
Dedicated flows for trending items, new arrivals, and BOGO-style content help the storefront feel curated and commercially planned.
Retail-ready interface quality
Responsive catalog layout, search, product detail presentation, and multi-step browsing flow make the site feel usable as a real customer-facing storefront.
Storefront frontend
The customer-facing experience is built with Next.js and TypeScript, covering category routes, product pages, search, auth screens, and shopping-state views.
Next.js 15TypeScriptReactTailwind CSSsearch UIcategory routing
Backend service layer
A separate Node.js and Express layer handles auth, user data, cart updates, wishlist operations, and health checks.
Node.jsExpress.jsJWTcookiesAxiosREST APIs
Persistence and models
MongoDB and Mongoose store products, user accounts, carts, and wishlists so shopping state has a real database-backed source of truth.
MongoDB AtlasMongooseproduct modeluser modelcart persistencewishlist persistence
Retail experience systems
The app includes merchandising sections, variant selections, and browsing structure that make it feel more like a living store than a plain data grid.
new arrivalstrendingBOGOsize optionscolor optionsresponsive product layout
Ownership
What I personally handled
Frontend storefront architecture for search, categories, product detail, cart, wishlist, and auth flows
Backend API design with Express, JWT auth, cookies, and user-specific data operations
MongoDB and Mongoose modeling for products, users, carts, and wishlists
Retail-oriented product detail behavior including size and color variant selection
Merchandising-led presentation for new arrivals, trending items, and BOGO sections
Responsive UI and state management for a realistic multi-step shopping experience
Technology index
Core technologies used
Next.js 15TypeScriptReactNode.jsExpress.jsMongoDB AtlasMongooseJWTcookies-nextAxiosTailwind CSSwishlist persistencecart persistencevariant-aware product pages