Специализация
Python Backend Developer
Java Backend Developer
Node.js Backend Developer
Golang Backend Developer
React Frontend Developer
Выберите навыки
React
JavaScript
Git
Redux
Webpack
Сложность
1-3
4-6
7-8
9-10
Рейтинг вопросов
1
2
3
4
5
Подпишись на React Developer в телеграм
В чем разница между display: none и visibility: hidden?
• display: none полностью удаляет элемент с веб-страницы, как если бы его не существовало. Он не занимает места в макете, и элементы после него сдвигаются, чтобы занять его пространство.
• visibility: hidden скрывает элемент, но оставляет его место на странице. Элемент всё ещё занимает пространство в макете, но не виден пользователю.
Как вставить видео в HTML?
Для вставки видео в HTML используется тег <video>. Внутри него указываются источники видео через тег <source>, а также можно добавить атрибуты, такие как controls для отображения элементов управления, autoplay для автоматического воспроизведения и loop для повторного воспроизведения.
Как работают hidden classes и shape-based оптимизации в V8?
Hidden classes (скрытые классы) в V8 — это внутренние структуры, которые движок создает для представления форм объектов и их свойств. Когда вы создаете объекты с одинаковыми свойствами, V8 присваивает им один и тот же скрытый класс, что ускоряет доступ к их свойствам. Shape-based оптимизации позволяют движку быстро определять, где находятся свойства в памяти, что значительно уменьшает время доступа к ним.
Каковы преимущества использования CSS Grid и Flexbox ?
CSS Grid и Flexbox упрощают создание адаптивных и сложных раскладок. Grid подходит для построения двухмерных макетов, где нужно управлять как строками, так и столбцами, в то время как Flexbox идеально подходит для одномерных раскладок, таких как выравнивание элементов в строке. Оба инструмента позволяют легко управлять выравниванием, распределением пространства и адаптивностью.
Как использовать CSS grid для создания сеток, которые адаптируются под разные размеры экранов?
CSS Grid позволяет создавать гибкие макеты с помощью свойств, таких как grid-template-columns, grid-template-rows и grid-template-areas. Эти свойства помогают управлять размещением элементов и адаптировать макет для разных экранов с использованием медиазапросов.
Что такое middleware в Redux и для чего он используется?
Использовал ли didCatch в React?
Расскажи про принципы Solid
Как архитектура FSD соотносится с принципами SOLID?
Как интерпретировать принцип замены Лисков (L в SOLID) во фронтенде (на примере React)?
Рейтинг:
3
Сложность:
5
Middleware в Redux — это функции, которые оборачивают метод dispatch, добавляя к нему дополнительное поведение. Они используются для работы с асинхронными операциями, логированием, обработкой ошибок и другими задачами. Примеры популярных middleware — redux-thunk и redux-saga.
Рейтинг:
3
Сложность:
5
componentDidCatch — это метод класса React для перехвата ошибок в дочерних компонентах. Он используется в Error Boundaries (границах ошибок), чтобы показать запасной UI вместо падения всего приложения.
Рейтинг:
3
Сложность:
10
SOLID — это пять принципов ООП:
Single Responsibility (Единственная ответственность) — Класс должен решать только одну задачу.
Open-Closed (Открытость/закрытость) — Код должен быть открыт для расширения, но закрыт для изменений.
Liskov Substitution (Подстановка Лисков) — Подклассы должны заменять родительские классы без ошибок.
Interface Segregation (Разделение интерфейсов) — Лучше много маленьких интерфейсов, чем один большой.
Dependency Inversion (Инверсия зависимостей) — Зависимости должны строиться на абстракциях, а не на конкретных классах.
Рейтинг:
4
Сложность:
10
FSD (Feature-Sliced Design) и SOLID решают схожие задачи – создание понятного и масштабируемого кода. Основные параллели:
Рейтинг:
2
Сложность:
7
Принцип подстановки Лисков гласит, что любой дочерний класс должен корректно заменять родительский, не нарушая работу программы. В React это означает, что компонент, расширяющий или заменяющий другой, должен полностью сохранять его контракт (пропсы, поведение), чтобы не ломать логику приложения.
Рейтинг:
2
Сложность:
4
Рейтинг:
1
Сложность:
3
Рейтинг:
1
Сложность:
8
Рейтинг:
3
Сложность:
6
Рейтинг:
3
Сложность:
8