← All topics

Next.js Junior interview questions and answers

75 questions for a Next.js (Junior) interview - with correct answers, explanations and links to the docs.

Take this quiz
  1. 1.What is colocation in the App Router?
  2. 2.What is Next.js?
  3. 3.How do you create a page at /about in the App Router?
  4. 4.How does layout.tsx differ from page.tsx?
  5. 5.What must the root app/layout.tsx contain?
  6. 6.How do you create a dynamic route /blog/:slug?
  7. 7.How do you correctly read params in a Next.js 16 page?
  8. 8.Why is <Link> from next/link better than a plain <a href> for internal navigation?
  9. 9.What kind of components are files in the app/ folder by default?
  10. 10.A component uses useState and onClick but crashes with an error. What's missing?
  11. 11.What is the loading.tsx file for?
  12. 12.Why must error.tsx be a client component?
  13. 13.How do you show a 404 page for a nonexistent product in a server page?
  14. 14.How do you set a page's title and description in the App Router?
  15. 15.At what URL is the file public/logo.png served?
  16. 16.How do you create a GET /api/users API endpoint in the App Router?
  17. 17.Which environment variables are available in browser code?
  18. 18.What does the <Image> component from next/image give you?
  19. 19.Why does <Image src="https://cdn.example.com/a.jpg" ... /> produce a configuration error?
  20. 20.What does next/font do?
  21. 21.Where do you import useRouter from in the App Router?
  22. 22.How do you get the current path in a client component, e.g. to highlight the active link?
  23. 23.How does SSR differ from SSG?
  24. 24.What is ISR (Incremental Static Regeneration)?
  25. 25.When does getServerSideProps run in the Pages Router?
  26. 26.What does getStaticPaths do in the Pages Router?
  27. 27.What does a folder in parentheses do, e.g. app/(marketing)/about/page.tsx?
  28. 28.Why give a folder a name with an underscore, e.g. app/_components?
  29. 29.Which route will catch /docs/a/b/c?
  30. 30.What do the next build and next start commands do?
  31. 31.Which bundler does Next.js 16 use by default for next dev and next build?
  32. 32.In Next.js 16, what is the file formerly called middleware.ts named?
  33. 33.How do you redirect the user to /login from a server component?
  34. 34.How do you get the ?page=2 query parameter in a server page?
  35. 35.How do you load data in a server component?
  36. 36.Where do you import global CSS in the App Router?
  37. 37.Where does a console.log from a server component appear?
  38. 38.What do you pass to <Image> for an image that stretches over the whole parent block?
  39. 39.How do you lazy-load a heavy client component in Next.js?
  40. 40.Why load third-party scripts via next/script?
  41. 41.How do you build a Next.js app into a set of static files without a Node.js server?
  42. 42.What happens if app/dashboard/ contains both page.tsx and route.ts?
  43. 43.How does template.tsx differ from layout.tsx?
  44. 44.Can you use the useState and useEffect hooks in a server component?
  45. 45.When does <Link> prefetch a route?
  46. 46.Will state in a sidebar inside a shared layout survive navigation between pages?
  47. 47.How do you type the props of app/blog/[slug]/page.tsx in Next.js 16?
  48. 48.What is the minimum Node.js version required for Next.js 16?
  49. 49.Can you use CSS Modules in Next.js without extra configuration?
  50. 50.What title does the page get with export const metadata = { title: 'Profile' } in the page and title: { template: '%s | Shop', default: 'Shop' } in the layout?
  51. 51.How does a client component read the [slug] segment of the current URL?
  52. 52.How do you generate sitemap.xml in the App Router?
  53. 53.Which file controls the /robots.txt response?
  54. 54.How do you set the site favicon in the App Router?
  55. 55.How does permanentRedirect() differ from redirect()?
  56. 56.How do you redirect the old /blog/:slug URLs to /news/:slug for every request, without code in pages?
  57. 57.What happened to the next lint command in Next.js 16?
  58. 58.Can the app/ folder live inside src/?
  59. 59.When should you use router.push() instead of <Link>?
  60. 60.What does the replace prop do on <Link>?
  61. 61.What does scroll={false} on <Link> do?
  62. 62.What is the useLinkStatus hook for?
  63. 63.How do you handle POST /api/posts in a Route Handler?
  64. 64.Is the alt prop required on next/image?
  65. 65.Which .env file is meant for local secrets and should not be committed?
  66. 66.Why does export const metadata in a 'use client' page cause an error?
  67. 67.Which pages does app/dashboard/layout.tsx wrap?
  68. 68.Where do you set themeColor in Next.js 16?
  69. 69.How do you add a web app manifest for a PWA?
  70. 70.Do you need 'use client' at the top of every client component file?
  71. 71.How do you add JSON-LD structured data to a page?
  72. 72.How does a server component read a request header like user-agent?
  73. 73.What does export const dynamicParams = false do on a page with generateStaticParams (without Cache Components)?
  74. 74.How do you serve the whole app under /docs (e.g. acme.com/docs)?
  75. 75.Which next/script strategy loads a script during browser idle time, e.g. a chat widget?