Next.js Interview Questions

Fundamentals

1. What is Next.js?

Next.js is a React framework for building full-stack web applications. It provides features like file-based routing, Server Components, API routes, optimized images, and flexible rendering strategies (SSR, SSG, ISR).

2. What is the App Router?

App Router (Next.js 13+) is a new routing system built on React Server Components. It uses the app/ directory with new conventions for layouts, loading states, and error handling.

3. Server Components vs Client Components?

Server Components (default) render on server, reducing client bundle. Client Components ("use client") run in browser, can use hooks and event handlers.

4. What is ISR (Incremental Static Regeneration)?

ISR allows you to update static pages after deployment without rebuilding the entire site. Use revalidate option to set how often to regenerate pages.

5. What are Server Actions?

Server Actions are async functions that run on the server. They can be called from Server or Client Components to handle form submissions and data mutations.

Rendering & Performance

6. What is Streaming?

Streaming allows you to progressively render UI from server. Use Suspense boundaries to stream parts of the page as they become ready.

7. What is Partial Prerendering?

Experimental feature that combines static and dynamic rendering in the same route. Static shell with dynamic content holes.

8. How does Next.js optimize images?

Next.js Image component automatically optimizes images: lazy loading, responsive sizes, modern formats (WebP/AVIF), prevents layout shift.

9. What is the difference between Link and router.push?

Link is for declarative navigation with automatic prefetching. router.push is for programmatic navigation. Both provide client-side navigation.

10. What is middleware in Next.js?

Middleware runs before request is completed. Used for authentication, redirects, rewrites, setting headers. Runs on Edge runtime.