Собеседование Frontend (React) - вопросы и подготовка

Этот набор карточек создан для тех, кто готовится к собеседованию на позицию Frontend-разработчика с фокусом на React. Здесь собраны часто задаваемые вопросы, которые помогут систематизировать знания и уверенно чувствовать себя на интервью. В набор входят: - основы JavaScript и современные возможности ES6+; - ключевые концепции React: компоненты, хуки, состояние, контекст; - оптимизация производительности и работа с жизненным циклом компонентов; - управление состоянием (Redux, Context API и альтернативы); - работа с API и асинхронными запросами; вопросы по HTML, CSS и адаптивной верстке, которые часто встречаются на фронтенд-собеседованиях. Карточки подойдут как начинающим разработчикам, так и опытным специалистам, которые хотят освежить знания перед собеседованием. Благодаря структурированным вопросам и ответам, подготовка станет более быстрой и эффективной.

Вы можете начать изучение этого набора. Вам будет отправлено 376 сообщений для повторения каждой карточки несколько раз в соответствие с кривой забывания.

Узнайте больше о методе интервального повторения.

Запланируйте ежедневные повторения карточек на случай если вам нужно запомнить за короткий срок или довести эти знания до автоматического уровня.

Узнайте больше о ежедневных практиках.

Создать

1/ 94

React

Что такое React?

React

Что такое React?

1/94

JSX

Что такое JSX?

2/94

React: основные преимущества

Какие основные преимущества использования React?

3/94

Virtual DOM

Что такое Virtual DOM, и как он работает?

4/94

Состояние (state) в React

Что такое "состояние" (state) компонента в React?

5/94

Обновление состояния компонента

Как обновить состояние компонента?

6/94

Пропсы (props) в React

Что такое пропсы (props) в React?

7/94

Состояние и пропсы: в чем разница?

В чем разница между состоянием и пропсами?

8/94

Передача данных между компонентами (вверх и вниз)

Вопрос: Как передать данные между компонентами вверх и вниз по иерархии?

9/94

Условный рендеринг в React

Что такое условный рендеринг в React?

10/94

События в React

Как обрабатывать события в React?

11/94

HTTP-запросы в React

Как выполнить HTTP-запросы в React?

12/94

Контекст в React

Что такое контекст (context) в React и для чего он используется?

13/94

PureComponent

Как реализовать PureComponent?

14/94

Стили в React-компонентах

Как использовать стили в React-компонентах?

15/94

Ключи (keys) в списках React

Что такое ключи (keys) в списках React-элементов и зачем они нужны?

16/94

Неуправляемые компоненты (uncontrolled components)

Что такое «неуправляемые компоненты» (uncontrolled components)?

17/94

Управляемые компоненты (controlled components)

Что такое «управляемые компоненты» (controlled components)?

18/94

Форма в React

Как создать форму в React?

19/94

Подъём состояния (Lifting State Up)

Что такое «подъем состояния» (lifting state up)?

20/94

Условное добавление класса в React

Как реализовать условное добавление класса к элементу в React?

21/94

Фрагменты в React

Что такое фрагменты (fragments) в React?

22/94

HOC (Higher-Order Component) в React

Что такое HOC (Higher-Order Component) в React?

23/94

Оптимизация производительности React

Каким образом можно оптимизировать производительность React-приложения?

24/94

HOC и render props: в чем разница

В чем разница между HOC и компонентами рендер-пропсов (render props)?

25/94

Рефы (refs) в React

Что такое рефы (refs) в React и как они используются?

26/94

Анимация в React-приложении

Как реализовать анимацию в React-приложении?

27/94

React: lazy loading с Suspense

Как реализовать lazy loading в React с использованием Suspense?

28/94

Порталы в React

Что такое порталы (portals) в React?

29/94

Контекст (context)

Как работает механизм «контекста» (context) для передачи данных?

30/94

Как создать собственный хук в React

Как создать собственный хук в React?

31/94

React 16: ключевые нововведения

Какие нововведения были добавлены в React 16?

32/94

React DevTools: отладка

Как использовать React DevTools для отладки приложения?

33/94

Хуки в React

Что такое «хуки» (hooks) в React и для чего они используются?

34/94

Error Boundary в React

Как обрабатывать ошибки в React-приложении с помощью Error Boundary?

35/94

Управление состоянием: библиотеки (кроме useState)

Какие популярные библиотеки для управления состоянием вы знаете, помимо встроенного useState?

36/94

Согласование (reconciliation) в React

Как работает алгоритм согласования (reconciliation) в React?

37/94

Оптимизация рендеринга в React

Каким образом можно оптимизировать рендеринг компонентов в React?

38/94

Глубокое сравнение в React

Что такое «глубокое сравнение» (deep comparison) в контексте оптимизации производительности React?

39/94

Мемоизация компонентов

Как использовать memoization для оптимизации компонентов?

40/94

React Router — как работает

Как работает библиотека React Router?

41/94

Паттерны Redux

Какие паттерны использования Redux вы знаете?

42/94

Асинхронная загрузка компонентов в React Router

Как реализовать асинхронную загрузку компонентов с помощью React Router?

43/94

SSR vs CSR

Что такое SSR (Server-Side Rendering) и как он отличается от CSR (Client-Side Rendering)?

44/94

Преимущества Redux

Какие преимущества дает использование Redux для управления состоянием приложения?

45/94

Redux Thunk

Что такое Redux Thunk?

46/94

Нормализация состояния

Что такое «нормализация состояния» (state normalization) в контексте управления состоянием приложения?

47/94

Ленивая загрузка Redux‑редьюсеров

Как реализовать ленивую загрузку Redux-редьюсеров?

48/94

Redux-Saga: как это работает

Как работает Redux Saga?

49/94

Styled Components

Что такое Styled Components, и как оно используется?

50/94

CSS Modules в React

Как работает CSS-модули (CSS Modules) в React?

51/94

SSR в React: передача данных сервер → клиент

Как передать данные с сервера на клиент при использовании SSR в React?

52/94

Хуки useEffect и useLayoutEffect

Какие особенности имеют хуки useEffect и useLayoutEffect?

53/94

CSS Grid в React

Что такое CSS Grid и как его использовать в React?

54/94

CSS-in-JS в React

Что такое CSS-in-JS, и какие библиотеки вы знаете для реализации этой концепции в React?

55/94

Обновление состояния после async-операции

Как обновить состояние компонента после выполнения асинхронной операции?

56/94

Аутентификация и авторизация в React

Как реализовать аутентификацию и авторизацию в React-приложении?

57/94

Маршрутизация на стороне клиента в React

Как работает маршрутизация на стороне клиента в React?

58/94

Code splitting в React

Что такое "code splitting" (разделение кода) в React?

59/94

Управление состоянием между несвязанными компонентами

Как управлять состоянием между компонентами, не имеющими близкой связи?

60/94

Ленивая загрузка компонентов в React

Как работает «ленивая загрузка» (lazy loading) компонентов в React?

61/94

Тестирование компонентов React

Какие средства предоставляет React для тестирования компонентов?

62/94

Синтетические события в React

Что такое «синтетические события» (synthetic events) в React?

63/94

Переиспользование компонентов в React

Как организовать переиспользование компонентов в React?

64/94

Именование компонентов в React

Какие принципы следует соблюдать при именовании компонентов в React?

65/94

Анимация переходов в React Router

Как реализовать анимацию переходов между компонентами в React Router?

66/94

Модальное окно в React

Как реализовать модальное окно в React-приложении?

67/94

Глубокий перенос состояния (React)

Что такое «глубокий перенос состояния» (deep state transfer) в React?

68/94

SSR (Server‑Side Rendering)

Что такое SSR (Server-Side Rendering) и зачем его использовать?

69/94

CSS‑модули (CSS Modules)

Какие преимущества дает использование CSS-модулей (CSS Modules)?

70/94

Виртуализация списка в React

Что такое «виртуализация списка» (list virtualization) и как она реализуется в React?

71/94

Консилиация (Reconciliation) в React

Что такое «консилиация» (reconciliation) в контексте React?

72/94

React: include компонентов

Как реализовать include компонентов в React?

73/94

Формы в React

Как обрабатывать формы в React?

74/94

Альтернативы Redux для React

Какие существуют альтернативы Redux для управления состоянием в React-приложениях?

75/94

Hot Module Replacement (HMR) в React

Как работает «горячая замена модулей» (Hot Module Replacement) в среде разработки React‑приложений?

76/94

Связывание данных (data binding) в React

Как реализовать связывание данных (data binding) в React?

77/94

Мемоизация (memoization) в React

Что такое "мемоизация" (memoization) и как она может быть применена в React?

78/94

Drag-and-drop в React

Как реализовать перетаскивание (drag-and-drop) элементов в React-приложении?

79/94

Вычисляемые свойства в React

Что такое "вычисляемые свойства" (computed properties) в контексте React?

80/94

Передача данных через контекст (React)

Что такое «передача данных через контекст» (context passing) в React?

81/94

Рендер-пропсы (render props)

Что такое «рендер-пропсы» (render props) и как они используются?

82/94

Ленивая загрузка сторонних библиотек в React

Как работает «ленивая загрузка» (lazy loading) сторонних библиотек в React?

83/94

Реактивное программирование и React

Что такое «реактивное программирование» (reactive programming) в контексте React?

84/94

Ленивая загрузка изображений в React

Как реализовать «ленивую загрузку» (lazy loading) изображений в React?

85/94

Инкапсуляция состояния в React

Что такое «инкапсуляция состояния» (state encapsulation) в React?

86/94

Как обрабатывать ошибки с хуками в React

Как обрабатывать ошибки при использовании хуков (hooks) в React?

87/94

Обновление состояния после изменения props (React)

Как обновить состояние компонента после изменения props?

88/94

Стабильные ключи (keys) в React

Что такое стабильные идентификаторы (stable keys) и зачем они нужны в React?

89/94

HOC (компоненты высшего порядка) в React

Что такое «компоненты высшего порядка» (Higher-Order Components, HOC) в React?

90/94

Анимированный переход между компонентами в React Native

Как реализовать анимированный переход между компонентами в React Native?

91/94

Реактивный поток данных в React

Что такое «реактивный поток данных» (reactive data flow) в контексте React?

92/94

Паттерны асинхронности в React

Какие есть паттерны для работы с асинхронностью в React?

93/94

Stale closure

Что такое stale closure (устаревшее замыкание)?

94/94