React Frontend Developer

Question 1

Можете привести пример counter-increment и counter-reset в CSS для создания автоматической нумерации на веб-странице?

Accepted Answer

Эти свойства позволяют динамически увеличивать счетчики для элементов, таких как заголовки, списки и другие элементы, что делает нумерацию более гибкой и управляемой.

С помощью counter-reset мы создаем новый счетчик, а counter-increment увеличиваем его значение для определенных элементов. Например, мы можем использовать эти свойства для автоматической нумерации заголовков на странице. Счетчик может быть сброшен при помощи counter-reset, а при каждом появлении элемента с counter-increment счетчик будет увеличиваться.

Question 2

Как отличить git clone от git remote?

Accepted Answer

git clone используется для создания копии удалённого репозитория на вашем локальном компьютере, включая все его коммиты и историю.git remote управляет удалёнными репозиториями, позволяя добавлять, удалять или изменять удалённые URL-адреса для вашего локального репозитория.

Question 3

Что такое force remount и когда его применяют

Accepted Answer

force remount — это принудительное пересоздание компонента с нуля, а не его обновление. Чаще всего это делается через изменение key. При remount компонент теряет всё внутреннее состояние и эффекты запускаются заново. Используется редко и осознанно.

Question 4

Как обрабатывать частичный отказ при падении или недоступности одного из remote-микрофронтов?

Accepted Answer

При частичном отказе микрофронта нужно обеспечить отказоустойчивость приложения. Основные подходы: показывать запасной UI (fallback), использовать кешированные версии модуля или скрывать сломанную секцию. Критично не допускать полного падения всего приложения из-за одной нерабочей части. Реализация зависит от выбранного фреймворка (например, Module Federation в Webpack) и должна включать глобальные обработчики ошибок загрузки.

Question 5

Какие особенности есть у деплоя SPA в on-premise и cloud окружениях?

Accepted Answer

Деплой SPA в on-premise окружении означает развертывание на собственных серверах компании, что дает полный контроль над инфраструктурой, безопасностью и конфигурацией, но требует больше ресурсов на поддержку. В облаке (например, AWS S3, Vercel) хостинг статических файлов проще, масштабируется автоматически и часто интегрирован с CI/CD. Ключевое отличие — управление инфраструктурой: on-premise требует ручной настройки веб-серверов (Nginx, Apache) и SSL, а cloud предоставляет managed-сервисы.

Question 6

Почему removeEventListener может не удалить обработчик?

Accepted Answer

Метод removeEventListener может не удалить обработчик, если переданные ему параметры не совпадают в точности с теми, которые использовались при добавлении через addEventListener. Чаще всего это происходит, когда в качестве обработчика передаётся анонимная функция, так как каждый вызов создаёт новую функцию в памяти. Также важно совпадение фаз события (capturing или bubbling) и других опций, если они указаны.

Question 7

Чем единицы измерения rem и em отличаются друг от друга?

Accepted Answer

em и rem — относительные единицы измерения в CSS. em зависит от размера шрифта родительского элемента, а rem — от размера шрифта корневого элемента (html). Это означает, что em может накапливаться при вложенности, а rem всегда стабилен. Используйте rem для глобальных отступов и размеров, а em — для элементов, которые должны масштабироваться относительно своего контекста.

Question 8

Откуда браузер берёт дефолтное значение font-size для REM и где можно его переопределить?

Accepted Answer

Браузер берёт дефолтное значение font-size для REM из корневого элемента , обычно это 16px. Переопределить его можно, задав свойство font-size для селектора html в CSS. Это влияет на все REM-значения на странице.

Question 9

От чего зависит единица EM — от ближайшего REM или от родительского font-size?

Accepted Answer

Единица em зависит от font-size родительского элемента, а не от rem. Если у родителя font-size 20px, то 1em у дочернего элемента будет равен 20px. Если у родителя не задан font-size, em берётся от ближайшего предка с заданным размером шрифта, иначе от браузерного значения по умолчанию (обычно 16px).

Question 10

Как removeEventListener определяет, какой именно обработчик нужно удалить?

Accepted Answer

removeEventListener удаляет обработчик по совпадению трёх параметров: типа события, ссылки на ту же самую функцию и значения опции capture. Если передать другую функцию или другую опцию capture, удаление не сработает. Поэтому нельзя удалить анонимную функцию, созданную заново. Нужно сохранять ссылку на исходный обработчик.

Вопросы React Frontend Developer