Frontend Interview - собеседования по Javascript / Html / Css
Канал для подготовки к собеседованиям по фронтенду Админ, сотрудничество, реклама: @seniorFrontPromo, @maria_seniorfront Купить рекламу: https://telega.in/c/frontendinterview Канал в реестре РКН: https://rknn.link/su
Больше📈 Аналитический обзор Telegram-канала Frontend Interview - собеседования по Javascript / Html / Css
Канал Frontend Interview - собеседования по Javascript / Html / Css (@frontendinterview) языкового сегмента Русский является активным участником. Сейчас сообщество объединяет 10 793 подписчиков, занимая 11 386 место в категории Технологии и приложения и 60 232 место в регионе Россия.
📊 Показатели аудитории и динамика
С момента создания невідомо проект демонстрирует стремительный рост, собрав аудиторию из 10 793 подписчиков.
Согласно последним данным от 28 июня, 2026, канал показывает стабильную активность. За последние 30 дней изменение числа участников составило -74, а за последние 24 часа — 0, при этом общий охват остаётся высоким.
- Статус верификации: Не верифицирован
- Уровень вовлечённости (ER): Средний показатель вовлечённости аудитории составляет 9.36%. В первые 24 часа после публикации контент обычно набирает 4.16% реакций от общего числа подписчиков.
- Охват публикаций: В среднем каждый пост получает 1 010 просмотров. В течение первых суток публикация набирает 449 просмотров.
- Реакции и взаимодействия: Аудитория активно поддерживает контент: среднее количество реакций на один пост — 4.
- Тематические интересы: Контент сосредоточен на ключевых темах, таких как javascript, браузер, html, css, видимость.
📝 Описание и контентная политика
Автор описывает ресурс как площадку для выражения субъективного мнения:
“Канал для подготовки к собеседованиям по фронтенду
Админ, сотрудничество, реклама: @seniorFrontPromo, @maria_seniorfront
Купить рекламу: https://telega.in/c/frontendinterview
Канал в реестре РКН:
https://rknn.link/su”
Благодаря высокой частоте обновлений (последние данные получены 29 июня, 2026) канал поддерживает актуальность и высокий уровень охвата публикаций. Аналитика показывает, что аудитория активно взаимодействует с контентом, что делает его важной точкой влияния в категории Технологии и приложения.
.header-primary {
font-size: 2em;
color: #18191C;
margin-bottom: .5em;
}
.header-secondary {
font-size: 1.6em;
color: #18191C;
}
Конкретный оттенок чёрного #18191C используется по всей странице в совершенно разных элементах: заголовках, тексте, кнопках, полях ввода. Кажется, что это не должно создавать никаких проблем, но на самом деле есть ряд неудобств, которых хотелось бы избежать.
Во-первых, если завтра по какой-то причине нужно будет немного изменить оттенок чёрного, придётся это делать во многих местах.
Во-вторых, приходится копировать и вставлять HEX-значение цвета, ну или запоминать первые несколько символов, чтобы текстовый редактор сумел нам подсказать.
Все эти неудобства уходят, если использовать CSS-переменные. Чаще их называют кастомные свойства.
Кастомное свойство — это произвольное свойство с определённым значением. Оно отличается от стандартного CSS-свойства способом записи. Чтобы применить кастомное свойство, нужно передать его в CSS-функцию var().
Стандартное свойство:
.list-item {
margin-left: 10px;
}
.list-item .link {
margin-left: 10px;
}
Кастомное свойство:
.list {
--element-gap: 10px;
}
.list-item {
margin-left: var(--element-gap);
}
.list-item .link {
margin-left: var(--element-gap);
}
Кастомных свойств не существует в спецификации CSS. По способам применения они больше всего похожи на переменные в языках программирования. Если мы определили кастомное свойство, то в дальнейшем можно его переиспользовать сколько угодно раз.
👉 @frontendInterview "09:10:01" -> "09:10:01"
"11:70:10" -> "12:10:10"
"19:99:99" -> "20:40:39"
"24:01:01" -> "00:01:01"
👉 @frontendInterview <body>
<h1>Hello World</h1>
<ul>
<li class="item feature">Item one</li>
<li class="item">Item two</li>
<li class="item">Item three</li>
</ul>
</body>
В этом коде у нас есть заголовочный элемент и список элементов. Теперь давайте напишем наш CSS:
@layer base, special;
@layer special {
.item {
color: red;
}
}
@layer base {
.item {
color: blue;
}
.feature {
color: green;
}
}
Здесь у нас два слоя. Все элементы будут красными (red), потому что в схеме слоя special — с максимальным приоритетом — для свойства color задано значение red.
Если мы поменяем порядок слоёв и сделаем приоритетным *@layer* special, base;, то все элементы станут синими, за исключением первого элемента, который будет зелёным. Это произойдёт из-за приоритета специфичности, так как стиль .feature следует после стиля .item
Чтобы использовать ключевое слово revert-layer, давайте добавим эти стили:
@layer base, special;
@layer special {
.item {
color: red;
}
.feature {
color: revert-layer;
}
}
@layer base {
.item {
color: blue;
}
.feature {
color: green;
}
}
Внутри нашего слоя special мы задаём цвет для значения revert-layer в селекторе элемента .feature.
В результате весь список элементов становится красным, а элемент .feature — зелёным, потому что происходит откат к соответствующему свойству предыдущего каскадного слоя, для которого мы задали значение green.
👉 @frontendInterview<dialog>
👉 @frontendInterview
Уже доступно! Исследование Telegram 2025 — ключевые инсайты года 
