Question 1

Що таке Context API у React?

Accepted Answer

Context API — це вбудований механізм React, що дозволяє ділитися даними між компонентами без явної передачі props через кожен рівень. Він вирішує проблему prop drilling, створюючи глобальний стан, доступний для всіх дочірніх компонентів. Context особливо підходить для даних, що рідко змінюються, таких як тема, мова або інформація про автентифікованого користувача.

Question 2

Яка функція використовується для створення нового Context?

Accepted Answer

Функція createContext — це нативний метод React для ініціалізації нового контексту. Вона приймає необов'язкове значення за замовчуванням, яке буде використано, якщо компонент споживає Context без батьківського Provider. Ця функція повертає об'єкт, що містить Provider та Consumer, хоча Consumer рідко використовується з сучасними hooks.

Question 3

Який hook використовується для споживання значення Context?

Accepted Answer

Hook useContext дозволяє дочірнім компонентам читати значення, надане найближчим Provider у дереві компонентів. Він замінює старіший API Consumer та пропонує більш лаконічний і читабельний синтаксис. Компонент автоматично повторно підпишеться на зміни Context та оновиться відповідно.

Управління станом з Context

Що таке Context API у React?

Відповідь

Яка функція використовується для створення нового Context?

Відповідь

Який hook використовується для споживання значення Context?

Відповідь

Який компонент використовується для надання значення Context?

Що відбувається, якщо компонент використовує useContext без батьківського Provider?

Інші теми співбесід React / Next.js

Основи JavaScript

Основи React

React Hooks

Життєвий цикл компонента

React Router

Форми та Controlled Components

Отримання даних та API

React Query (TanStack Query)

Styling & CSS-in-JS

Основи Next.js

TypeScript з React

Data Fetching у Next.js

Server Actions у Next.js

Маршрутизація та Навігація в 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 для наступної співбесіди