Myntra Clone

web

Pixel-perfect e-commerce platform replicating Myntra's shopping experience — dynamic product catalog with advanced filtering, Redux-powered cart with persistent state, and fully responsive design tested across 10+ device breakpoints.

JavaScriptCSSHTML

A vanilla-JS e-commerce clone that proves you don't need a framework to ship product.

The problem

Most e-commerce tutorials reach for React + Redux + a UI kit before they've thought about the data model. I wanted to internalize the patterns — cart state, filters, persistence, responsive layouts — without leaning on a framework to do it for me.

The approach

Rebuilt Myntra's catalogue experience from scratch in vanilla JS + custom CSS. Cart state lives in a small reducer-style store with localStorage persistence, mirroring how Redux works under the hood. Filters compose declaratively — each filter is a function over the catalogue, so adding a new one (size, color, brand) doesn't touch the rest. Layouts hand-tuned across 10+ breakpoints using CSS grid + clamp.

Tech decisions

Vanilla JS (no framework)

Forces a deeper understanding of the patterns that React/Vue abstract away

Hand-rolled reducer store

Demystifies state management — same mental model as Redux, ~30 lines of code

CSS grid + clamp()

Fluid responsive layouts without breakpoint spam

localStorage persistence

Cart survives reloads without a backend; works fully offline

Outcomes

Catalogue + filters + cart flow with no framework dependency
10+ device breakpoints tested in DevTools + real hardware
Cart state persists across reloads via localStorage
Zero npm dependencies; deployable as static files

What I learned

Building once without a framework changes how you read framework source code forever. clamp() + grid auto-fit do 80% of what a UI kit's responsive system does, for free.