Auping

Case study for Auping project, migrating Next.js 12 to Next.js 15

Fabrice
Case StudyNext.jsServer ComponentsClient ComponentsPerformanceDesignAuping

Auping is known for its innovative, headless eCommerce approach and international presence. After their initial digital transformation, I joined the project at a later phase to support a major re-architecture of their customer-facing frontend.

Project Focus

Teaming up with a colleague, my main responsibility was to migrate and fully rebuild Auping's Next.js application:

  • Upgraded from Next.js v12 (Pages Router) to v15 (App Router).
  • Shifted routing, data fetching, and component architecture to align with modern Next.js best practices (server components, incremental static regeneration, etc.).
  • Addressed legacy logic, deprecated APIs, and technical debt to ensure long-term scalability and maintainability.

Key Contributions

  • Re-architected Routing & Structure:
    Transitioned the app’s codebase from the old pages directory to the new app directory. Implemented modular layouts, optimized server/client separation, and ensured backwards compatibility for business-critical flows.
  • Modernized Data Layer:
    Refactored API calls and data-fetching logic to leverage newer async server components and improved caching strategies. Applied best practices for GraphQL integration and API response handling.
  • Component & UI Upgrades:
    Updated or rewritten UI components for compatibility with the new app router, taking advantage of improved performance and rendering options. Ensured responsiveness and accessibility for all supported locales and device types.
  • Testing & Rollout:
    Collaborated on QA, regression testing, and phased rollouts to minimize disruption. Coordinated feedback with stakeholders and users throughout migration.

Outcome

The new frontend delivers a faster, more maintainable, and future-proof user experience, positioning Auping’s digital storefront for ongoing growth and innovation in eCommerce. This upgrade sets the stage for easier feature development, enhanced performance, and continued expansion across European markets.


Click on this link to see Auping’s website.