Маршрутизація та Навігація в Next.js
Dynamic routes, route groups, parallel routes, intercepting routes, useRouter, Link, redirect
1Який синтаксис для створення динамічного маршруту в Next.js App Router?
Який синтаксис для створення динамічного маршруту в Next.js App Router?
Відповідь
Динамічні маршрути в Next.js App Router використовують квадратні дужки для визначення змінних сегментів URL. Наприклад, [id] створює маршрут, який захоплює будь-яке значення на цій позиції в URL. Це значення потім доступне через параметри сторінки. Ця конвенція дозволяє створювати загальні сторінки, що адаптуються до різного вмісту без створення окремих файлів для кожного варіанту.
2Яка основна роль компонента Link у Next.js?
Яка основна роль компонента Link у Next.js?
Відповідь
Компонент Link є рекомендованим елементом навігації в Next.js. Він автоматично попередньо завантажує видимі маршрути у viewport та дозволяє навігацію на стороні клієнта без повного перезавантаження сторінки. На відміну від стандартного тегу a, Link підтримує стан додатку та забезпечує плавні переходи між сторінками, значно покращуючи досвід користувача та продуктивність.
3Як отримати доступ до параметрів динамічного маршруту в Server Component?
Як отримати доступ до параметрів динамічного маршруту в Server Component?
Відповідь
У Next.js App Router Server Components автоматично отримують об'єкт params, що містить динамічні сегменти URL. Цей об'єкт передається як prop до функції компонента. Наприклад, для маршруту [id], params.id міститиме захоплене значення. Цей підхід спрощує доступ до параметрів без потреби у клієнтських хуках.
Яка головна перевага route groups у Next.js?
У чому різниця між useRouter та usePathname?
+19 питань зі співбесід
Інші теми співбесід React / Next.js
Основи JavaScript
Основи React
React Hooks
Життєвий цикл компонента
React Router
Управління станом з Context
Форми та Controlled Components
Отримання даних та API
React Query (TanStack Query)
Styling & CSS-in-JS
Основи Next.js
TypeScript з React
Data Fetching у Next.js
Server Actions у Next.js
API Routes у Next.js
Metadata & SEO у Next.js
Middleware та Auth у Next.js
Тестування React
Zustand State Management
Оптимізація продуктивності React
Error Boundaries & обробка помилок
Advanced React Patterns
Розширені можливості Next.js
Розгортання та Продакшн Next.js
Architecture & Design Patterns
React Server Components
Інтернаціоналізація Next.js
React Безпека & Найкращі Практики
Опануй React / Next.js для наступної співбесіди
Отримай доступ до всіх питань, flashcards, технічних тестів, вправ code review та симуляторів співбесід.
Почни безкоштовно