Вже доступно! Дослідження 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 799 підписників, посідаючи 11 430 місце в категорії Технології та додатки та 60 405 місце у регіоні Росія.
📊 Показники аудиторії та динаміка
З моменту свого створення невідомо, проект продемонстрував стрімке зростання, зібравши аудиторію у 10 799 підписників.
За останніми даними від 25 червня, 2026, канал демонструє стабільну активність. Хоча за останні 30 днів спостерігається зміна кількості учасників на -84, а за останні 24 години на 1, загальне охоплення залишається високим.
- Статус верифікації: Не верифікований
- Рівень залученості (ER): Середній показник залученості аудиторії становить 9.28%. Протягом перших 24 годин після публікації контент зазвичай збирає 4.11% реакцій від загальної кількості підписників.
- Охоплення публікацій: В середньому кожен допис отримує 1 002 переглядів. Протягом першої доби публікація в середньому набирає 444 переглядів.
- Реакції та взаємодія: Аудиторія активно підтримує контент: середня кількість реакцій на один пост – 4.
- Тематичні інтереси: Контент зосереджений навколо ключових тем, таких як javascript, браузер, html, css, видимость.
📝 Опис та контентна політика
Автор описує ресурс як майданчик для висловлення суб'єктивної думки:
“Канал для подготовки к собеседованиям по фронтенду
Админ, сотрудничество, реклама: @seniorFrontPromo, @maria_seniorfront
Купить рекламу: https://telega.in/c/frontendinterview
Канал в реестре РКН:
https://rknn.link/su”
Завдяки високій частоті оновлень (останні дані отримано 26 червня, 2026), канал підтримує актуальність та високий рівень охоплення публікацій. Аналітика показує, що аудиторія активно взаємодіє з контентом, що робить його важливою точкою впливу в категорії Технології та додатки.
10 799
Підписники
+124 години
-157 днів
-8430 день
Архів дописів
Что выведется в консоль?
Как работает реактивность в vue.Js ?
Реактивность — это одна из ключевых характеристик фреймворка, которая позволяет автоматически обновлять пользовательский интерфейс при изменении состояния. Вот как это работает:
Реактивные данные:
Vue использует объекты с реактивными свойствами, чтобы отслеживать изменения. Когда данные изменяются, Vue автоматически обновляет связанные с ними компоненты.
Объект Vue:
При создании нового экземпляра Vue, он делает все данные, определенные в опции
data, реактивными.
var vm = new Vue({
data: {
message: 'Hello Vue!'
}
});
var vm = new Vue({
el: '#app',
data: {
message: 'Hello Vue!'
}
});vm.message интерфейс автоматически обновится:
vm.message = 'Hello World!';data и преобразует их в геттеры и сеттеры с помощью Object.defineProperty. Этот процесс называется обсервацией.
2. Детекторы изменений (Observers):
Каждый раз, когда создается реактивное свойство, создается объект наблюдателя (Observer), который следит за изменениями этого свойства.
3. Депенденси трекинг (Dependency Tracking):
Во время рендера компонента, Vue регистрирует все зависимости (реактивные свойства), которые используются. Это означает, что Vue "запоминает", какие свойства нужно отслеживать для каждого компонента.
4. Реактивное обновление:
Когда реактивное свойство изменяется, Vue уведомляет все компоненты, которые зависят от этого свойства, и они автоматически перерисовываются.
Реактивные системы в действиях
new Vue({
el: '#app',
data: {
a: 1,
b: 2
},
computed: {
sum() {
return this.a + this.b;
}
},
watch: {
a(newValue, oldValue) {
console.log(`a изменилось с ${oldValue} на ${newValue}`);
}
}
});sum автоматически пересчитывается, когда a или b изменяются.
Наблюдатели (watchers): Реагируют на изменения данных и могут выполнять побочные эффекты.
Преимущества
1. Простота использования: Можно сосредоточиться на логике приложения, а не на обновлении DOM.
2. Высокая производительность: Vue эффективно отслеживает изменения и обновляет только те части DOM, которые изменились.
3. Поддержка сложных приложений: Реактивная система Vue легко масштабируется для больших и сложных приложений.
👉 @frontendInterview
Прокачаем ваш frontend скилл с junior до middle
Научим писать код, который не стыдно показать
Первые 7 дней бесплатно. Попробуй!
Узнать больше
#реклама 16+
ykul.ru
О рекламодателе
Reverse words
Выполните функцию, которая принимает строковый параметр и меняет местами каждое слово в строке. Все пробелы в строке должны быть сохранены.
Примеры:
"This is an example!" ==> "sihT si na !elpmaxe"
"double spaces" ==> "elbuod secaps"
Новые возможности JavaScript
Руководство по JavaScript для тех, кто хочет кодить быстро и эффективно.
«Новые возможности JavaScript» — это сборник правил написания кода на современном языке JavaScript. На наглядных примерах автор объясняет, как работают последние версии JS, какие приемы в нем можно использовать, чтобы сделать код коротким и чистым, а каких ошибок лучше избегать, чтобы не было багов.
👉 @frontendInterview
+8
Живи и зарабатывай в Крыму 2 500 000 рублей ежегодно!
👌Поможем подобрать лучшие апартаменты Крыма с собственным пляжем, видом на море и горы
😊Живите сами, отдыхайте здесь с семьей или сдавайте и получайте пассивный доход 2 500 000 рублей в год
-Апартаменты на любой вкус а также под ваш бюджет
-Акции от застройщиков: рассрочка без переплат, ежемесячный платеж всего 50 тысяч рублей
-Старт продаж!
-Апартаменты с видом на море или горы - под ваш вкус!
🏠Мы предлагаем несколько способов покупки а также услуги по подбору недвижимости с помощью: ипотеки, рассрочки, дистанционной покупки
✅Узнайте подробнее и получите вкусное предложение
Узнать больше
Проектная декларация на сайте https://наш.дом.рф/
#реклама
mrqz.me
О рекламодателе
Можете ли вы описать основное различие между методами forEach и map?
Чтобы понять разницу между ними, давайте посмотрим, что делает каждая функция.
forEach
- Перебирает элементы в массиве.
- Вызывает callback-функцию для каждого элемента.
- Не возвращает значение.
const a = [1, 2, 3];
const doubled = a.forEach((num, index) => {
// Делаем что-либо с num и/или index.
});
// doubled = undefined const a = [1, 2, 3];
const doubled = a.map(num => {
return num * 2;
});
// doubled = [2, 4, 6]
Это я через 5 лет «вышел погулять» после тяжёлого трудового дня
👉 @frontendInterview
Какой метод интеграции изменений переписывает историю коммитов?
Работа с атрибутами HTML элементов в JavaScript
В этой статье разберемся как манипулировать HTML элементами, после того как они будут найдены через JS. Важной частью этой работы, является взаимодействие с атрибутами HTML элементов.
👉 @frontendInterview
Бесплатный курс по дизайну в FIGMA
Онлайн-программа с наставником и чатом.
Осторожно! 80% практики.
По результату обучения у вас будет портфолио из нескольких работ.
Сертификат о прохождении курса.
Возможность пройти полное обучение и получить гарантированное трудоустройство!
Учитесь дизайну у профессионалов.
Переходи по кнопки: "Узнать больше" и начинай свое обучение.
Доступ 0 руб.
Узнать больше
#реклама 16+
yudaevschool24.online
О рекламодателе
Можно ли увеличить или уменьшить поле ввода? Управляем этим через стили.
Свойство resize указывает, может ли пользователь изменять размеры элемента, и в каком направлении. В случае, если изменение размеров элемента возможно, в одном из его углов появится специальная иконка, похожая на треугольник, зажав которую пользователь сможет изменить размер элемента в одном, или нескольких, направлениях.
Часто используется для <textarea>, но можно применить к любому элементу, кроме:
- строчных (inline) элементов;
- блочных (block), для которых задано свойство overflow со значением visible (является значением по умолчанию для большинства элементов).
По умолчанию поле ввода <textarea> может изменять свой размер, если потянуть за нижний правый угол. Если вы хотите запретить изменение размеров текстовой области, вы должны явно указать значение свойства resize как none.
Как пишется
- none — размеры изменить нельзя (значение по умолчанию).
- both — размеры можно изменять по горизонтали и вертикали.
- horizontal — размер можно изменять по горизонтали.
- vertical — размер можно изменять по вертикали.
Экспериментальные значения:
- block — размер можно изменять в блочном измерении элемента.
- inline — размер можно изменять в строковом измерении элемента.
Блочное или строчное измерение элемента зависит от направления текста, задаваемого свойствами writing-mode и direction.
По умолчанию поддерживается в Firefox и Safari. В браузерах Chrome и Edge необходимо включить флаг Experimental Web Platform features. Более подробную информацию можно узнать на caniuse.
👉 @frontendInterview
Что лучше анимировать: transform, margin или width?
📕Открытый урок по манипуляции с HTML и CSS с помощью JavaScript для начинающих и опытных разработчиков JavaScript, frontend и веб разработчикам
На открытом уроке 19 февраля в 20:00 мск мы узнаем всё об основах динамичного взаимодействия с элементами страницы.
📗В результате вы:
- Узнаете, как использовать JavaScript для взаимодействия с HTML и CSS, включая управление элементами страницы через простые клики и другие события;
- Изучите основные методы изменения стилей и классов, чтобы делать интерфейсы более динамичными;
- Освоете практические навыки для применения в проектах, позволяя создавать страницы с интерактивными элементами, которые реагируют на действия пользователей.
👉 Регистрируйтесь прямо сейчас, чтобы не пропустить мероприятие: https://otus.pw/eAIt/
📙 Все участники открытого урока получат скидку на курс "Fullstack Developer"
Реклама. ООО «Отус онлайн-образование», ОГРН 1177746618576 erid 2SDnjeHiuvk
Будьте в центре цифровой повестки
Как технологии помогают бизнесу решать задачи в 2025 году? Что нового в цифровизации? Какие тренды нужно знать уже сегодня?
В телеграм-канале «Цифровизируй это» от VK Tech мы отвечаем на все эти вопросы. А еще делимся анонсами событий, которые нельзя пропустить:
✅ вебинары с разработчиками IT-решений,
✅ разборы ключевых кейсов,
✅ дискуссии о будущем цифровизации.
Подписывайтесь, чтобы не пропустить важное и оставаться на шаг впереди.
Подписаться
#реклама
О рекламодателе
Что происходит при схлопывании границ?
Это процесс в CSS, когда вертикальные внешние отступы (margins) двух или более блоков объединяются в один. Это поведение касается только вертикальных отступов (margin-top и margin-bottom) и не касается горизонтальных (margin-left и margin-right).
Почему это нужно?
Схлопывание границ помогает избежать ненужных больших отступов между элементами. Например, если у двух соседних элементов установлены верхний и нижний отступы, то без схлопывания они бы суммировались и создавали избыточное пространство между элементами.
Как это работает?
Если у одного блока снизу есть margin-bottom, а у другого блока сверху есть margin-top, то итоговый отступ между этими блоками будет равен большему из двух значений, а не их сумме. Если у элемента задан margin-top и он находится первым в контейнере, его верхний отступ может схлопнуться с верхним отступом контейнера. Если у элемента установлен margin-bottom и он является последним в контейнере, его нижний отступ может схлопнуться с нижним отступом контейнера. В этом примере между блоками будет отступ не 50px (20px + 30px), а 30px, потому что сработает схлопывание границ и возьмется большее значение.
<!DOCTYPE html>
<html>
<head>
<style>
.block1 {
margin-bottom: 20px;
background-color: lightblue;
}
.block2 {
margin-top: 30px;
background-color: lightcoral;
}
</style>
</head>
<body>
<div class="block1">Блок 1</div>
<div class="block2">Блок 2</div>
</body>
</html>
😡 Устал от нудных уроков на YouTube, где половина — вода?
Хватит это терпеть) Автор канала Формошлёп убрал воду и оставил только суть:
➧ Мини-гайды по HTML, CSS и JavaScript, которые легко читать и сразу применять.
➧ Шпаргалки, лайфхаки и полезные советы с ноткой юмора.
➧ Всё чётко, лаконично и по делу.
Неважно, новичок ты или фронтендер на опыте — у нас всегда найдётся что-то полезное!
Присоединяйся: @frontbox будем вместе шлёпать формы и красить кнопки)
Credit Card Mask
Обычно, когда вы что-то покупаете, вас спрашивают, верен ли номер вашей кредитной карты, номер телефона или ответ на ваш самый секретный вопрос. Однако, поскольку кто-то может заглянуть вам через плечо, вы не хотите, чтобы это отображалось на экране. Вместо этого мы маскируем его. Ваша задача - написать функцию maskify, которая меняет все символы, кроме последних четырех, на '#'.
Примеры (ввод --> вывод):
"4556364607935616" --> "############5616"
"64607935616" --> "#######5616"
"1" --> "1"
"" --> ""
// "What was the name of your first pet?"
"Skippy" --> "##ippy"
"Nananananananananananananananana Batman!" --> "####################################man!"