E-commerce · Next.js migration
lululemon UAE: Angular to Next.js Storefront Migration
lululemon UAE moved from an Angular and Spartacus storefront to a custom Next.js application with full server-side rendering, new features and SmartEdit.
Outgrowing Angular and Spartacus
The Angular and Spartacus storefront made performance tuning and new features harder than they needed to be. For a fashion catalogue built around colour, size and fit choices, lululemon UAE needed full control over rendering and the product journey, with SAP Commerce Cloud staying as the backend.
Building a Faster Future for lululemon UAE
The goal was more than a framework swap. We replaced the Angular and Spartacus frontend with a custom Next.js storefront that adds new features, renders every page on the server and plugs into SmartEdit, so content teams keep editing visually while shoppers get faster pages.
Next.js, SSR and SmartEdit
Using Next.js and React, we rebuilt the frontend layer with full server-side rendering, so homepage, category and product pages reach shoppers and search engines as complete HTML. The architecture is modular, reuses React components across templates and replaces the Angular-based Spartacus implementation with a SmartEdit integration for content teams.
What Made This Project a Success
Moving lululemon UAE to Next.js was about a faster, cleaner and more future-proof storefront, not only new technology. Here is what made the project stand out and how it benefits shoppers, content teams and the business.
Technology stack
Frontend
Next.js
Server-side rendering and routing
React JS
Component-based UI
TypeScript
Typed, maintainable code
Redux
Predictable state management
Commerce and integrations
SAP Commerce APIs
Catalogue, cart and checkout
SmartEdit
Visual content management
checkout.com
Payments
OAuth
Secure authentication
Markup and styling
HTML5
Semantic, accessible markup
SCSS
Modular styling
Tailwind
Utility-first CSS
Engagement and security
Braze
Customer engagement
GA4
Analytics and events
Veracode
Security scanning
lululemon UAE storefront in focus
Homepage
Product list
Product page
Cart · screenshot coming soon
Checkout · screenshot coming soon
Content page · screenshot coming soon
Migration timeline: Jun 2026 – Nov 2026
Foundation
Next.js project setup with TypeScript, SCSS and Tailwind, plus shared React components and Redux state.
Storefront journeys
Home, category, product, cart and checkout rebuilt with server-side rendering on top of the SAP Commerce APIs.
Integrations
checkout.com payments, OAuth sign-in, Braze engagement and GA4 analytics connected to the new storefront.
Security, QA and launch
Veracode scans, testing and performance tuning, then the move from Angular and Spartacus with SmartEdit managing content.
Lighthouse snapshot of the live storefront
92
Lighthouse SEO score
89
Lighthouse Accessibility score
0.02
Cumulative Layout Shift
Lab data for the live storefront (mobile), measured with Lighthouse 13.4 on 13 Nov 2026.
Visual Highlights from the lululemon UAE Rebuild
A closer look at the live Next.js storefront: homepage category shortcuts and the product listing grid, all server-side rendered and responsive on every device.
