System Design bank Next.js System Design / 20 questions Your progress 0 / 20 done Saved in this browser. Reset All 20 Medium 10 Hard 10 Hide done No questions match those filters. 01 Explain the App Router's file-based conventions and how nested layouts compose. Medium 02 Migrate a large Pages Router app to App Router - what's your phased strategy? Hard 03 Explain getStaticProps vs getServerSideProps vs getInitialProps. Medium 04 Why might a team stay on Pages Router instead of migrating to App Router? Hard 05 Explain how dynamic and catch-all routes work in Next.js. Medium 06 Design the routing structure for a multi-tenant SaaS app with custom domains per tenant. Hard 07 Explain the Metadata API and how it differs from manually managing head tags. Medium 08 Design dynamic metadata generation for a product page pulling from a CMS. Hard 09 Explain how nested layouts avoid re-rendering shared UI on navigation. Medium 10 Design a layout structure for an app with a persistent sidebar and independently loading content panes. Hard 11 Explain Next.js Middleware and its execution constraints under the Edge runtime. Medium 12 Design an authentication and A/B testing strategy using Middleware. Hard 13 Explain how Server Actions work and their security implications. Medium 14 Design a form submission flow using Server Actions with optimistic UI updates. Hard 15 Explain the four caching layers in the Next.js App Router: request memoization, data cache, full route cache, router cache. Medium 16 Debug a page that's serving stale data despite calling revalidatePath. Hard 17 Explain the difference between time-based and on-demand revalidation. Medium 18 Design a revalidation strategy for a live sports score page updated every 10 seconds. Hard 19 Explain how next/image optimizes images and handles responsive sizing. Medium 20 Debug a Largest Contentful Paint regression caused by a misconfigured next/image priority prop. Hard ← Previous React Next → JavaScript