Уже доступно! Исследование Telegram 2025 — ключевые инсайты года 
Frontend Interview - собеседования по Javascript / Html / Css
Открыть в Telegram
Канал для подготовки к собеседованиям по фронтенду Админ, сотрудничество, реклама: @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 794 подписчиков, занимая 11 404 место в категории Технологии и приложения и 60 263 место в регионе Россия.
📊 Показатели аудитории и динамика
С момента создания невідомо проект демонстрирует стремительный рост, собрав аудиторию из 10 794 подписчиков.
Согласно последним данным от 26 июня, 2026, канал показывает стабильную активность. За последние 30 дней изменение числа участников составило -81, а за последние 24 часа — 0, при этом общий охват остаётся высоким.
- Статус верификации: Не верифицирован
- Уровень вовлечённости (ER): Средний показатель вовлечённости аудитории составляет 9.17%. В первые 24 часа после публикации контент обычно набирает 4.08% реакций от общего числа подписчиков.
- Охват публикаций: В среднем каждый пост получает 990 просмотров. В течение первых суток публикация набирает 441 просмотров.
- Реакции и взаимодействия: Аудитория активно поддерживает контент: среднее количество реакций на один пост — 4.
- Тематические интересы: Контент сосредоточен на ключевых темах, таких как javascript, браузер, html, css, видимость.
📝 Описание и контентная политика
Автор описывает ресурс как площадку для выражения субъективного мнения:
“Канал для подготовки к собеседованиям по фронтенду
Админ, сотрудничество, реклама: @seniorFrontPromo, @maria_seniorfront
Купить рекламу: https://telega.in/c/frontendinterview
Канал в реестре РКН:
https://rknn.link/su”
Благодаря высокой частоте обновлений (последние данные получены 27 июня, 2026) канал поддерживает актуальность и высокий уровень охвата публикаций. Аналитика показывает, что аудитория активно взаимодействует с контентом, что делает его важной точкой влияния в категории Технологии и приложения.
10 794
Подписчики
Нет данных24 часа
-137 дней
-8130 день
Архив постов
Шпаргалки для начинающего верстальщика HTML/CSS
Книга отлично подходит тем, кто только начинает учить верстку. Здесь вы найдете универсальный код и полезные советы, крутые эффективные ресурсы, применяя которые можно быстро и легко научиться верстать реальные проекты. Вы откроете новые фишки, лайфхаки для своей верстки...
👉 @frontendInterview
Курс графического дизайна с нуля. Бесплатное обучение!
Выбери свое направление в дизайне: графический дизайн, веб-дизайн, UX/UI-дизайн.
И изучи бесплатно основы дизайна с личным наставником! 3 работы в портфолио.
Узнать больше
#реклама 16+
yudaevschool24.online
О рекламодателе
Расскажите про приоритет селекторов
Приоритет селекторов (также известный как специфичность селекторов) определяет, какие стили будут применяться к элементу, если на него действуют несколько правил с различными селекторами. Специфичность основана на типах селекторов и их количественном присутствии в одном CSS-правиле.
Как она вычисляется?
Специфичность выражается четырьмя уровнями: A, B, C, D. Чем выше значения, тем более специфичный селектор.
A: Инлайновые стили (например,
style="color: red;") имеют самую высокую специфичность.
B: Количество ID-селекторов в селекторе (например, #header).
C: Количество классов, атрибутов и псевдоклассов (например, .class, [type="text"], :hover).
D: Количество тегов и псевдоэлементов (например, div, h1, ::before).
Рассмотрим несколько примеров и определим их специфичность:
1. #main-content — (0, 1, 0, 0)
2. .article p — (0, 0, 1, 1)
3. header h1 span — (0, 0, 0, 3)
4. div#main .content .text — (0, 1, 2, 1)
Чем выше значения специфичности, тем выше приоритет стиля. Если два селектора имеют одинаковую специфичность, то стиль, который объявлен позже, будет применён.
Пример
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Пример специфичности</title>
<style>
p {
color: black; /* (0, 0, 0, 1) */
}
.text {
color: blue; /* (0, 0, 1, 0) */
}
#highlight {
color: red; /* (0, 1, 0, 0) */
}
p#highlight {
color: green; /* (0, 1, 0, 1) */
}
</style>
</head>
<body>
<p class="text" id="highlight">Этот текст будет зелёным.</p>
</body>
</html>
<p> элемент действует несколько селекторов с разной специфичностью:
p имеет специфичность (0, 0, 0, 1)
.text имеет специфичность (0, 0, 1, 0)
#highlight имеет специфичность (0, 1, 0, 0)
p#highlight имеет специфичность (0, 1, 0, 1)
Поскольку p#highlight имеет наивысшую специфичность (0, 1, 0, 1), он применяет стиль цвета зелёный.
Почему это важно?
- Управление конфликтами стилей: Знание специфичности помогает правильно управлять стилями и избегать конфликтов.
- Чтение и поддержка кода: Более специфичные селекторы позволяют писать CSS, который легко поддерживать и расширять.
- Эффективность разработки: Понимание специфичности позволяет создавать более предсказуемый и стабильный код.
👉 @frontendInterview
pov: ты решил залететь в айти в 2024-м
👉 @frontendInterview
Закрытый клуб для айтишников
FAANG School, чьи выпускники работают в Яндексе, СБЕРЕ и других гигантах, запустили бесплатное сообщество для всех, кто изучает Java.
Общайся в ламповом чате с такими же людьми «в теме», получай фидбек у опытных разрабов и черпай практические рекомендации от экспертов школы.
В чате уже больше 10 000 человек, а новенькие, которые подключатся сейчас, получат доступ к большой библиотеке Java Junior с полезными материалами:
– Пошаговая RoadMap по Java
– Мануал по Docker. Основные команды и концепции
– Микросервисы. Вопросы с собеседований
– Шпаргалка по Kafka
– Инструкция по работе с Git
– Подробный гайд, как найти работу в IT без опыта
– Подборка платформ с вакансиями для java-разработчиков
Вступай сейчас. Открыли доступ всего на 24 часа!
Что такое "предварительный запрос" (Preflight Request) в контексте CORS?
+9
Помощь в трудоустройстве в IT-сфере!
В России из-за дефицита айтишников запустили бесплатную программу по обучению IT-специалистов. Теперь любой желающий может попробовать себя в IT с полного нуля и начать обучение бесплатно!
Узнайте про дальнейшее трудоустройство в ведущие IT-компании для восполнения кадрового дефицита.
Для этого нужно:
- Перейти по ссылке
- Заполнить анкету и ответить на вопросы (занимает менее 3 минут)
- На основании ваших ответов вы сразу узнаете, подходит ли вам сфера IT и сможете ли вы в ней работать
Перейти на сайт
#реклама 16+
urban-university.ru
О рекламодателе
А о техническом долге я скажу…
Бывало у вас такое, что приходилось вставлять не самое лучшее решение в код, только чтоб успеть сдать задачу перед условной выставкой? Или идет работа над проектом в течение уже пары месяцев, а документация откладывается на потом, когда все устаканится? Поздравляю, вы “счастливый” обладатель технического долга. Не стоит расстраиваться, это часть жизни, которую следует принять и проработать как на сеансе у психолога для комфортной жизни в будущем.
👉 @frontendInterview
💻 10 лет в IT, и я публикую только то, что сам читаю или собираюсь прочитать.
Это самые важные статьи и новости, которые действительно нужны разработчику.
Решил поделиться тем, что помогает мне быть в курсе всего.
Подписывайся на DevDrafts | RSS — здесь только то, что стоит твоего времени!
👉 @devdrafts_rss
Как сделать превью проекта на собственном сервере
Почти всегда в проекте существует задача смотреть на текущие сборки из неосновной ветки репозитория. В крупных проектах есть инженеры, которые занимаются такими задачами. А что, если вы один на проекте? А что, если вы работаете в опенсорс? А что, если у вас совсем маленькая команда и нет возможности нанимать инженеров с нужным опытом?
Есть несколько готовых сервисов. Если вы работаете над статическим сайтом, можно использовать GitHub Pages, Netlify или Surge. Но это не всегда удобно по целому ряду причин. А вот если есть свой выделенный сервер, возможности резко увеличиваются. Почему бы и не использовать уже имеющийся у вас ресурс?
Моё решение основано на использовании веб-сервера Nginx, зато кроме него ничего не понадобится. С другой стороны, вы всегда сможете приспособить моё решение под свои нужды.
👉 @frontendInterview
Какое значение примет переменная arr?
За что отвечает z-index?
Это CSS-свойство, которое определяет порядок расположения элементов по оси z (перпендикулярно экрану). Это свойство используется для управления тем, какие элементы будут отображаться поверх других, когда они перекрываются.
Как он работает?
Контекст наложения (stacking context): Чтобы
z-index работал, элемент должен иметь установленное значение position, отличное от static (например, relative, absolute, fixed или sticky). Без этого z-index не будет применяться.
Числовое значение: z-index принимает целые числа, включая отрицательные. Элементы с более высоким значением z-index будут отображаться поверх элементов с более низким значением.
Пример
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Пример z-index</title>
<style>
.box {
position: absolute;
width: 100px;
height: 100px;
}
.box1 {
background-color: red;
z-index: 1;
top: 50px;
left: 50px;
}
.box2 {
background-color: blue;
z-index: 2;
top: 80px;
left: 80px;
}
</style>
</head>
<body>
<div class="box box1"></div>
<div class="box box2"></div>
</body>
</html>
z-index: 1, а синий квадрат — z-index: 2. Поскольку значение z-index у синего квадрата выше, он будет отображаться поверх красного.
Почему это важно?
Управление перекрытиями: Важен для создания сложных интерфейсов, где элементы могут перекрываться. Это часто встречается в модальных окнах, всплывающих подсказках, выпадающих меню и т.д.
Визуальная иерархия: Он позволяет разработчикам управлять визуальной иерархией, гарантируя, что более важные элементы остаются видимыми и доступны пользователям.
👉 @frontendInterview
Millipede of words
Дан массив из 3-7 слов произвольной длины. Без заглавных букв. Слова объединяются, если последняя буква одного слова и первая буква другого слова одинаковы. Возвращается true, если все слова из набора могут быть объединены в одно слово. Каждое слово может и должно быть использовано только один раз. В противном случае возвращается false.
Пример:
solution(["no", "dog", "on", "good"]) => false solution(["engine", "endure", "elite"]) => true👉 @frontendInterview
Наглядный CSS
На 1 июня 2018 года CSS содержал 415 уникальных свойств, относящихся к объекту style в любом элементе браузера Chrome. Сколько свойств доступно в вашем браузере на сегодняшний день? Наверняка уже почти шесть сотен. Наиболее важные из них мы и рассмотрим.
Грег Сидельников упорядочил свойства по основной категории (положение, размерность, макеты, CSS-анимация и т. д.) и визуализировал их работу.
Вместо бесконечных томов документации – две с половиной сотни иллюстраций помогут вам разобраться во всех тонкостях работы CSS. Эта книга станет вашим настольным справочником, позволяя мгновенно перевести пожелания заказчика и собственное видение в компьютерный код!
👉 @frontendInterview
Что такое мемоизация ?
Это оптимизационная техника, используемая для ускорения выполнения программ путём сохранения результатов дорогостоящих функций и повторного использования этих результатов, когда снова возникают одинаковые входные данные, вместо того чтобы повторно выполнять функцию.
Как это работает
При первом вызове функции с определённым набором аргументов результат выполнения функции сохраняется в каком-либо хранилище (чаще всего в виде объекта или карты). При последующих вызовах функции с теми же аргументами, вместо выполнения функции, возвращается сохранённый результат. Это значительно сокращает время выполнения, особенно если исходная функция требует значительных вычислительных ресурсов.
Применение:
Мемоизация часто применяется для оптимизации производительности в различных областях, включая:
- Рекурсивные вычисления, например, вычисление чисел Фибоначчи.
- Дорогостоящие вычисления, которые часто повторяются с одними и теми же аргументами.
- Оптимизация производительности веб-приложений, например, в React, где меморизация помогает избежать ненужных перерисовок компонентов.
function memoize(fn) {
const cache = {};
return function(...args) {
const key = args.toString();
if (cache[key]) {
return cache[key];
} else {
const result = fn.apply(this, args);
cache[key] = result;
return result;
}
};
}
// Пример использования меморизации для функции вычисления факториала
const factorial = memoize(function(n) {
if (n === 0) {
return 1;
} else {
return n * factorial(n - 1);
}
});
console.log(factorial(5)); // Вычисляется и сохраняется в кэше
console.log(factorial(5)); // Возвращается результат из кэша, вычислений не происходит
Работодатели, выберите своего бойца
👉 @frontendInterview
Для чего используется свойство text-wrap в CSS?
