Skip to content
Mahabub.
Amana Big Bazar cover
E-CommerceLive2023

Amana Big Bazar

A commerce experience built for real catalog browsing — search, filters, cart flow, and delivery-oriented journeys that support everyday retail operations.

Case StudyLive Demo
Role
Full Stack Developer
Industry
Retail / E-Commerce
Team Size
Engineering + operations partners
Duration
Multi-phase delivery
Platform
Web · Responsive
Status
Live

Case narrative

Engineering story

Amana Big Bazar needed a storefront that could handle everyday retail browsing — categories, search, cart, and delivery-oriented journeys.

  1. Problem

    Without strong navigation and a dependable cart path, catalogs become unusable and purchase intent drops.

  2. Why it was difficult

    Commerce UI fails first at information architecture: finding products, trusting the cart, and understanding next steps.

  3. Approach

    I helped deliver a Vue storefront with Express-backed commerce workflows, focusing on category clarity and practical purchase flows.

  4. Why this approach

    Separating storefront concerns from API responsibilities kept browsing UX iterative while backend operations stayed flexible.

  5. Outcome

    A production e-commerce experience oriented around real shopping behavior rather than decorative catalog pages.

  6. What I learned

    Commerce UX fails first at navigation, not checkout polish Reusable components reduce inconsistency across catalog pages Backend clarity makes storefront iteration safer

Responsibilities & features

My responsibilities

  • Built category-driven browsing and filter experiences
  • Implemented cart and delivery-oriented UI flows
  • Supported backend integration for commerce operations

Key features

  • Category-based product display
  • Search and filter experiences
  • Add-to-cart and delivery-oriented pathways
  • Responsive storefront layouts

Trade-offs

Engineering decisions

Choices that shaped the architecture — including what we accepted in return.

  • Decision

    Category-first browsing model

    Reason

    Customers already think in categories — match mental models first.

    Trade-off

    Requires careful taxonomy work to avoid dead-end paths.

  • Decision

    Vue storefront + Express APIs

    Reason

    Allowed independent iteration of UI and operational data flows.

    Trade-off

    Needs clear contracts between client and services.

  • Decision

    Mobile-priority responsive layouts

    Reason

    Everyday shopping behavior is heavily mobile.

    Trade-off

    Desktop density is intentionally simpler than a dense admin grid.

System shape

Technical architecture

  • Vue storefront with reusable commerce components
  • Express APIs for catalog and operational data
  • SCSS/Bootstrap foundation for rapid responsive UI
  1. Client
  2. Vue Storefront
  3. Express API
  4. Commerce Data

Technology stack

  • Vue
  • JavaScript
  • Node.js
  • Express
  • Bootstrap
  • SCSS
  • Lean page composition for catalog browsing
  • Practical responsive treatment for product visuals

Visuals

Project screenshot

A product screenshot from this project. Select it to open a larger view.

Outcome

Business impact

Practical results across experience, maintainability, scale, and value — without invented metrics.

  • User experience

    Shoppers can browse by category and move through cart-oriented steps with less confusion.

  • Maintainability

    Shared commerce components reduce duplicated storefront patterns.

  • Scalability

    API separation supports catalog growth without rewriting the client shell.

  • Business value

    A usable digital storefront for everyday retail discovery and purchase intent.

Explore the live product

Open the deployment, or continue to another case study below.

Case StudyLive Demo