Skip to main content

Migration Checklist

Sitecore SXA → Headless Next.js

This checklist covers every key decision and task in the four-phase migration. Items marked critical should be addressed before go-live. Print or save as PDF for use in planning meetings.

Phase 1Phase 1 — Audit & Architecture

(12 items)
  • Document Sitecore version, edition (XM/XP/XM Cloud), and patch level
  • Identify rendering mode: vanilla MVC, SXA, existing JSS, or mixed
  • Inventory all renderings/components (count, type, datasource vs. layout-only)
  • Identify custom pipeline processors and their equivalents in headless
  • Document Glass.Mapper or ORM usage — plan typed interface replacements
  • Count and categorise media items (images, documents, video)
  • Document all active personalization rules and their xDB dependencies
  • Identify multisite configuration: number of sites, domains, language roots
  • Confirm headless approach: JSS SDK, XM Cloud JSS, or custom fetch
  • Map page templates to rendering modes: SSG / ISR / SSR per route type
  • Confirm hosting platform (Netlify / Vercel / self-hosted)
  • Set up JSS app registration in Sitecore (AppName, allowed controllers)

Phase 2Phase 2 — Component Migration

(12 items)
  • Set up Next.js project with TypeScript strict mode and ESLint
  • Configure Layout Service client with typed LayoutServiceData interface
  • Implement catch-all route [[...path]] for Sitecore content tree routing
  • Build component factory mapping Sitecore rendering names to React components
  • Migrate top 10 highest-traffic renderings first (validate architecture early)
  • Implement Placeholder component wiring for all nested placeholder names
  • Migrate all remaining renderings with typed field interfaces
  • Replace sc:Image / Html.Sitecore().Field() with next/image + JSS Image component
  • Configure next.config.ts remotePatterns for Sitecore media domain
  • Decide media strategy: direct CM serving vs. external CDN/DAM
  • Implement Experience Editor / Pages editing support (if required)
  • Verify all rendering parameters map correctly to React props

Phase 3Phase 3 — Advanced Features

(10 items)
  • Audit personalization rules — categorise as content-swap vs. behavioural
  • Implement audience segment detection in Next.js middleware
  • Wire segment to Layout Service request (sc_segment parameter or custom header)
  • Select search platform: Typesense / Algolia / Sitecore Search
  • Build Sitecore publish webhook → search index sync pipeline
  • Implement search UI with InstantSearch or custom debounced fetch
  • Configure multisite middleware with site map matching Sitecore sites config
  • Test language routing and locale fallback for all active languages
  • Validate robots.txt and sitemap.xml generation per site
  • Implement redirect handling (301/302 redirects from Sitecore redirect module)

Phase 4Phase 4 — DevOps & Launch

(12 items)
  • Set up GitHub Actions workflow with type check, lint, and build steps
  • Configure Netlify/Vercel site with environment variables and build command
  • Enable PR deploy previews and test with at least one real content branch
  • Store all secrets in CI environment (never in source control)
  • Configure Sitecore publish webhook to trigger ISR revalidation on content publish
  • Run Lighthouse audit on staging — target 90+ Performance, 100 Accessibility
  • Verify Core Web Vitals (LCP < 2.5s, CLS < 0.1, INP < 200ms) on real content
  • Test Experience Editor / Pages inline editing on staging (if in scope)
  • Validate 301 redirects from old URL structure to new routes
  • Set up error monitoring (Sentry free tier or equivalent)
  • Document rollback procedure (Netlify: one-click; Vercel: instant)
  • Confirm DNS cut-over plan with a maintenance window or zero-downtime strategy