← Усі теми

Питання на співбесіді з Next.js (Junior) з відповідями

75 запитань для співбесіди з теми Next.js (Junior) - з правильними відповідями, поясненнями й посиланнями на документацію.

Пройти цей тест
  1. 1.Що таке colocation в App Router?
  2. 2.Що таке Next.js?
  3. 3.Як в App Router створити сторінку за адресою /about?
  4. 4.Чим layout.tsx відрізняється від page.tsx?
  5. 5.Що обов'язково має бути в кореневому app/layout.tsx?
  6. 6.Як створити динамічний маршрут /blog/:slug?
  7. 7.Як правильно прочитати params у сторінці Next.js 16?
  8. 8.Чим <Link> з next/link кращий за звичайний <a href> для внутрішніх переходів?
  9. 9.Якими компонентами за замовчуванням є файли в папці app/?
  10. 10.Компонент використовує useState і onClick, але падає з помилкою. Чого бракує?
  11. 11.Для чого потрібен файл loading.tsx?
  12. 12.Чому error.tsx має бути клієнтським компонентом?
  13. 13.Як показати сторінку 404 для неіснуючого товару в серверній сторінці?
  14. 14.Як задати заголовок і опис сторінки в App Router?
  15. 15.За якою адресою доступний файл public/logo.png?
  16. 16.Як в App Router створити API-ендпоінт GET /api/users?
  17. 17.Які змінні оточення доступні в браузерному коді?
  18. 18.Що дає компонент <Image> з next/image?
  19. 19.Чому <Image src="https://cdn.example.com/a.jpg" ... /> видає помилку конфігурації?
  20. 20.Що робить next/font?
  21. 21.Звідки імпортувати useRouter в App Router?
  22. 22.Як у клієнтському компоненті отримати поточний шлях, наприклад, щоб підсвітити активне посилання?
  23. 23.Чим SSR відрізняється від SSG?
  24. 24.Що таке ISR (Incremental Static Regeneration)?
  25. 25.Коли виконується getServerSideProps у Pages Router?
  26. 26.Що робить getStaticPaths у Pages Router?
  27. 27.Що робить папка в круглих дужках, наприклад app/(marketing)/about/page.tsx?
  28. 28.Навіщо папці назва з підкресленням, наприклад app/_components?
  29. 29.Який маршрут спіймає /docs/a/b/c?
  30. 30.Що роблять команди next build і next start?
  31. 31.Який бандлер Next.js 16 використовує за замовчуванням для next dev і next build?
  32. 32.Як у Next.js 16 називається файл, що раніше називався middleware.ts?
  33. 33.Як перенаправити користувача на /login із серверного компонента?
  34. 34.Як отримати query-параметр ?page=2 у серверній сторінці?
  35. 35.Як завантажити дані в серверному компоненті?
  36. 36.Де підключати глобальний CSS в App Router?
  37. 37.Де з'явиться console.log із серверного компонента?
  38. 38.Що треба передати в <Image> для картинки, що розтягується на весь батьківський блок?
  39. 39.Як ліниво завантажити важкий клієнтський компонент у Next.js?
  40. 40.Навіщо підключати сторонні скрипти через next/script?
  41. 41.Як зібрати Next.js-застосунок у набір статичних файлів без Node.js-сервера?
  42. 42.Що станеться, якщо в app/dashboard/ лежать і page.tsx, і route.ts?
  43. 43.Чим template.tsx відрізняється від layout.tsx?
  44. 44.Чи можна використовувати хуки useState і useEffect у серверному компоненті?
  45. 45.Коли <Link> попередньо завантажує маршрут?
  46. 46.Чи збережеться стан у sidebar усередині спільного layout під час переходу між сторінками?
  47. 47.Як типізувати props сторінки app/blog/[slug]/page.tsx у Next.js 16?
  48. 48.Яка мінімальна версія Node.js потрібна для Next.js 16?
  49. 49.Чи можна використовувати CSS Modules у Next.js без додаткового налаштування?
  50. 50.Що виведе сторінка за export const metadata = { title: 'Профіль' } у page і title: { template: '%s | Shop', default: 'Shop' } у layout?
  51. 51.Як клієнтський компонент прочитає сегмент [slug] поточного URL?
  52. 52.Як згенерувати sitemap.xml в App Router?
  53. 53.Який файл керує відповіддю /robots.txt?
  54. 54.Як задати фавікон сайту в App Router?
  55. 55.Чим permanentRedirect() відрізняється від redirect()?
  56. 56.Як перенаправити старі URL /blog/:slug на /news/:slug для всіх запитів, без коду в сторінках?
  57. 57.Що сталося з командою next lint у Next.js 16?
  58. 58.Чи може папка app/ лежати всередині src/?
  59. 59.Коли варто використовувати router.push() замість <Link>?
  60. 60.Що робить проп replace у <Link>?
  61. 61.Що робить scroll={false} у <Link>?
  62. 62.Для чого потрібен хук useLinkStatus?
  63. 63.Як обробити POST /api/posts у Route Handler?
  64. 64.Чи обов'язковий проп alt у next/image?
  65. 65.Який .env-файл призначений для локальних секретів і не має потрапляти в репозиторій?
  66. 66.Чому export const metadata у сторінці з 'use client' спричиняє помилку?
  67. 67.Які сторінки обгортає app/dashboard/layout.tsx?
  68. 68.Де задається themeColor у Next.js 16?
  69. 69.Як додати маніфест вебзастосунку для PWA?
  70. 70.Чи потрібна 'use client' на початку кожного файлу клієнтського компонента?
  71. 71.Як додати на сторінку структуровані дані JSON-LD?
  72. 72.Як серверний компонент прочитає заголовок запиту, наприклад user-agent?
  73. 73.Що робить export const dynamicParams = false на сторінці з generateStaticParams (без Cache Components)?
  74. 74.Як віддавати весь застосунок за шляхом /docs (наприклад, acme.com/docs)?
  75. 75.Яка стратегія next/script завантажує скрипт під час простою браузера, наприклад віджет чату?