متاح الآن! بحث تيليغرام 2025 — أهم رؤى العام 
Frontend Interview - собеседования по Javascript / Html / Css
الذهاب إلى القناة على Telegram
Канал для подготовки к собеседованиям по фронтенду Админ, сотрудничество, реклама: @seniorFrontPromo, @maria_seniorfront Купить рекламу: https://telega.in/c/frontendinterview Канал в реестре РКН: https://rknn.link/su
إظهار المزيد📈 نظرة تحليلية على قناة تيليجرام 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?
