Вопросы React Frontend Developer

Prop drilling — это процесс передачи данных от родительского компонента к дочерним через "пропсы", даже если промежуточные компоненты не используют эти данные. Это может усложнить код, особенно при глубокой вложенности компонентов. Проблему prop drilling можно решить, используя такие подходы, как Context API или библиотеки управления состоянием (например, Redux).

 Пример:

function App() {
	return <Parent data="Привет" />;
}
function Parent({ data }) {
	return <Child data={data} />;
}
function Child({ data }) {
	return <Grandchild data={data} />;
}
function Grandchild({ data }) {
	return <h1>{data}</h1>;
}

<canvas> — это HTML-тег, который используется для рисования 2D и 3D графики через JavaScript. Сам по себе <canvas> не содержит графики; для её создания используется JavaScript API. Этот элемент полезен для анимаций, игр и динамического рендеринга изображений, но он требует программирования для каждой детали.

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

Специфичность в CSS — это способ определения приоритета CSS-правил, когда к одному элементу применяются несколько конфликтующих стилей. Она рассчитывается на основе количества селекторов разных типов в правиле:

• Инлайн-стили (например, style="color: red;") имеют наивысший приоритет.

• ID-селекторы (#id) более специфичны, чем классы (.class) или теги (div).

• Универсальные селекторы (*) и каскадность имеют минимальный приоритет.

 Например:

#id { color: blue; } /* более специфично, чем */
.class { color: green; }

Для создания таблицы в HTML используются теги <table>, <tr>, <td>, <th>, <thead>, <tbody> и <tfoot>. Тег <table> создает саму таблицу, <tr> — строку, <td> — ячейку, а <th> — заголовочную ячейку. Дополнительные теги, такие как <thead>, <tbody>, и <tfoot>, позволяют структурировать таблицу на разделы.