React Micro-Frontend Migration: Abercrombie & Fitch Case Study
IBM · Nov 2025 — Jun 2026
Abercrombie & Fitch Co.'s e-commerce frontend was a legacy Java-based monolith causing deployment friction, inconsistent UI, and difficulty scaling across multiple product teams working in parallel.
Migrated the legacy frontend to a React.js Micro-Frontend architecture using Module Federation, enabling independent deployments per product domain. Standardized component library by migrating the Global Configuration Hub to PrimeReact. Delivered Catalog, Product Details, Checkout and My List (Wishlist) micro-frontends across Abercrombie & Fitch, Hollister and Abercrombie Kids, integrated through a GraphQL Backend-for-Frontend (BFF) and containerized with Docker. Added analytics tracking, WCAG accessibility, A/B testing, Jest unit tests and Playwright end-to-end tests.
Enabled parallel deployments across independent product teams — eliminating the release coordination overhead of a monolithic frontend. Significantly reduced release friction, improved UI scalability and consistency across the enterprise e-commerce platform in a production enterprise environment.
Migrated legacy Java-based frontend to a React.js Micro-Frontend architecture across Abercrombie & Fitch, Hollister and Abercrombie Kids — building Catalog, Product Details, Checkout and My List (Wishlist) MFEs integrated through a GraphQL Backend-for-Frontend (BFF) and Webpack module federation. Revamped the Global Configuration Hub migrating legacy UI components to PrimeReact for enterprise consistency. Added analytics tracking, WCAG accessibility, A/B testing, Jest unit tests and Playwright end-to-end tests.
Need something similar built?
Available for freelance contracts and remote full-time roles globally.