Frontend | Вопросы собесов

Open in Telegram

Сайт easyoffer.ru Реклама @easyoffer_adv ВП @easyoffer_vp Тесты t.me/+T0COHtFzCJkwMDUy Задачи t.me/+_tcX2w2EmvdmMTgy Вакансии t.me/+CgCAzIyGHHg0Nzky

Network:easyoffer Russia36 850 Technologies & Applications7 290...

📈 Analytical overview of Telegram channel Frontend | Вопросы собесов

Channel Frontend | Вопросы собесов (@easy_javascript_ru) in the Russian language segment is an active participant. Currently, the community unites 18 347 subscribers, ranking 7 290 in the Technologies & Applications category and 36 850 in the Russia region.

📊 Audience metrics and dynamics

Since its creation on невідомо, the project has demonstrated rapid growth, gathering an audience of 18 347 subscribers.

According to the latest data from 03 June, 2026, the channel demonstrates stable activity. Although there has been a change in the number of participants by -76 over the last 30 days and by -4 over the last 24 hours, overall reach remains high.

Verification status: Not verified
Engagement rate (ER): The average audience engagement rate is 6.82%. Within the first 24 hours after publication, content typically collects 6.98% reactions from the total number of subscribers.
Post reach: On average, each post receives 1 251 views. Within the first day, a publication typically gains 1 281 views.
Reactions and interaction: The audience actively supports content: the average number of reactions per post is 11.
Thematic interests: Content is focused on key topics such as ставь, браузер, html, border, flex.

📝 Description and content policy

The author describes the resource as a platform for expressing subjective opinions:
“Сайт easyoffer.ru Реклама @easyoffer_adv ВП @easyoffer_vp Тесты t.me/+T0COHtFzCJkwMDUy Задачи t.me/+_tcX2w2EmvdmMTgy Вакансии t.me/+CgCAzIyGHHg0Nzky”

Thanks to the high frequency of updates (latest data received on 04 June, 2026), the channel maintains relevance and a high level of publication reach. Analytics show that the audience actively interacts with content, making it an important point of influence in the Technologies & Applications category.

18 347

Subscribers

-424 hours

-217 days

-7630 days

1 251

Post views

~ 1 28124 hours

~ 1 48248 hours

6.82%

Engagement rate

No data

Posts per day

Ads index

beta

Posts Archive

18 350

🤔 Когда используются теги div и span? - div — это блочный элемент, используется для структурирования больших участков контента; - span — строчный элемент, применяется для выделения текста внутри других блоков без создания новой строки. Ставь 👍 если знал ответ, 🔥 если нет Забирай 📚 Базу знаний

18 350

Яндекс Музыка до 360 дней бесплатно Яндекс Музыка для вас и 3-х ваших близких. Кинопоиск и Яндекс Книги тоже в подписке. Попробуйте бесплатно❤️ Слушать #реклама 18+ music.yandex.ru О рекламодателе

18 350

🤔 Когда брать абсолютные величины а когда относительные? Выбор между абсолютными и относительными единицами измерения зависит от контекста использования и целей, которые вы преследуете. Рассмотрим подробнее, когда и почему стоит использовать те или иные единицы. 🚩Абсолютные величины (например, px, pt, cm, in) Имеют фиксированные размеры и не зависят от других элементов или размеров экрана. Они всегда остаются одинаковыми, независимо от контекста. 🚩Когда использовать 1⃣Пиксели (`px`) Точные размеры: Когда вам нужно задать точные размеры элементов, например, для пиксельной точности в дизайне. Фиксированные элементы: Для элементов, размеры которых не должны изменяться в зависимости от экрана или родительского элемента (например, логотипы или иконки). Маленькие декоративные элементы: Когда размеры элементов настолько малы, что относительные единицы могут привести к неконтролируемому результату.

.logo {
  width: 100px;
  height: 50px;
}

🚩Относительные величины (например, %, em, rem, vw, vh) Изменяются в зависимости от других элементов или размеров экрана. Они позволяют создавать более гибкие и адаптивные макеты. 🟠Проценты (`%`) Адаптивные макеты: Когда нужно, чтобы элемент занимал определенный процент от размера родительского элемента. Контейнеры и блоки: Для ширины и высоты блоков, которые должны изменяться вместе с размерами родителя.

.container {
  width: 80%;
  height: 50%;
}

🟠Эм (`em`) Шрифты: Когда нужно задавать размер шрифта относительно размера шрифта родителя. Внутренние отступы и поля: Для создания элементов, которые масштабируются вместе с текстом.

.text {
  font-size: 1.2em;
  margin: 1em;
}

🟠Рем (`rem`): Глобальная консистентность: Когда нужно задавать размер относительно корневого элемента (обычно <html>), что обеспечивает более предсказуемое масштабирование. Шрифты и отступы: Для элементов, которые должны быть пропорциональны базовому размеру шрифта

body {
  font-size: 16px;
}

.header {
  font-size: 2rem; /* 32px */
  margin: 1rem;    /* 16px */
}

🟠Вьюпорт (`vw`, `vh`): Адаптивные размеры: Когда размеры элементов должны быть пропорциональны размеру вьюпорта (окна браузера). Фоновые изображения и видео: Для элементов, которые должны занимать определенный процент от экрана.

.hero {
  width: 100vw;
  height: 100vh;
}

🚩Комбинированное использование Иногда можно комбинировать абсолютные и относительные единицы для достижения наилучшего результата.

.container {
  width: 80%;  /* Относительная ширина */
  padding: 20px; /* Абсолютный внутренний отступ */
}

.text {
  font-size: 1.5rem; /* Относительный размер шрифта */
  margin: 2em; /* Относительный внешний отступ */
}

Ставь 👍 и забирай 📚 Базу знаний

18 350

Большая летняя распродажа курсов на Stepik На смене сезонов всегда появляется немного больше времени для себя: весенние дедлайны постепенно остаются позади, дни становятся светлее, а планы – легче. Чтобы помочь вам провести его с пользой – Stepik запускает сезонную распродажу онлайн-курсов. Она пройдет с 27 мая по 9 июня 2026 года и распространяется на многие курсы, представленные на платформе 👌 Вы можете подтянуть свои знания в программировании, дизайне, маркетинге, выучить английский язык, научиться готовить роллы и играть на гитаре с летней легкостью ❤️ Переходите в наш каталог распродажи найдите походящий курс на любую тему. Учитесь новому! Посмотреть каталог #реклама 16+ stepik.org О рекламодателе

18 350

🤔 Из каких секций состоит компонент Vue? - <template> — разметка; - <script> — логика компонента; - <style> — стили, можно использовать scoped для изоляции; Дополнительно — setup, lang, scoped, module и др. Ставь 👍 если знал ответ, 🔥 если нет Забирай 📚 Базу знаний

18 350

Как обрабатывать заявки быстрее конкурентов? CRM Битрикс24 автоматизирует работу с клиентами: • собирает заявки с сайта, из мессенджеров и звонков; • распределяет сделки между менеджерами; • позволяет выставлять счета и фиксировать оплаты в пару кликов; • с помощью нейросети анализирует звонки и помогает контролировать работу отдела. Весь цикл продаж — от заявки до оплаты — в одном окне. Бесплатно для любого числа сотрудников. Зарегистрироваться #реклама 16+ bitrix24.ru О рекламодателе

18 350

🤔 В чём отличие между мутациями и действиями? Мутации — это про изменение данных. Они простые и выполняются сразу. А действия — это про бизнес-логику и асинхронные операции. Действие вызывает мутацию, но само напрямую данные не меняет. Ставь 👍 если знал ответ, 🔥 если нет Забирай 📚 Базу знаний

18 350

18 350

🤔 Как с помощью js можно передвигать вперед/назад по истории браузера? В JavaScript можно перемещаться вперед и назад по истории браузера с помощью объекта window.history. 🟠Использование `history.back()` и `history.forward()` Эти методы аналогичны кнопкам "Назад" и "Вперед" в браузере.

history.back();    // Перемещение на одну страницу назад
history.forward(); // Перемещение на одну страницу вперед

Пример кнопок "Назад" и "Вперед"

<button onclick="history.back()">⬅️ Назад</button>
<button onclick="history.forward()">Вперед ➡️</button>

🟠Использование `history.go(n)` Этот метод позволяет перемещаться на определенное количество шагов: history.go(-1) – назад на 1 страницу history.go(1) – вперед на 1 страницу history.go(-2) – назад на 2 страницы

history.go(-2); // Перейти на две страницы назад
history.go(3);  // Перейти на три страницы вперед

🟠Получение длины истории `history.length` Если нужно узнать, сколько страниц в истории текущей сессии:

console.log(history.length); // Количество записей в истории

🟠Манипуляции с историей: `pushState()` и `replaceState()` Если нужно изменить URL без перезагрузки страницы, можно использовать: history.pushState(state, title, url) Добавляет новый URL в историю (как будто пользователь перешел по ссылке).

history.pushState({ page: 1 }, "Title 1", "/page1");

history.replaceState(state, title, url) Заменяет текущий URL (не добавляет новую запись в историю).

history.replaceState({ page: 2 }, "Title 2", "/page2");

Пример динамического изменения истории:

document.querySelector("button").addEventListener("click", () => {
  history.pushState({ page: "about" }, "About Page", "/about");
});

🟠Отслеживание изменений истории `popstate` Когда пользователь нажимает "Назад" или "Вперед", можно реагировать с помощью события popstate

window.addEventListener("popstate", (event) => {
  console.log("Текущий state:", event.state);
});

Ставь 👍 и забирай 📚 Базу знаний

18 350

День сурка frontend-разработчика Зарплата стоит, скучные задачи день за днем, календарь забит созвонами, которые не влияют вообще ни на что. Откликаешься на вакансии, а в ответ тишина либо какие-то мутные конторы. На собесах вместо нормальной оценки навыков цирк с алгоритмами на скорость, как будто ты на олимпиаде, а не работу ищешь. И самое неприятное, пока ты варишься в этом болоте, кто-то спокойно проходит собесы и уходит в Яндекс, VK или на хорошую Валютную удаленку без лишней драмы.

Есть классные проекты и сильные команды, где разработчиков действительно ценят, дают расти, поддерживают развитие и платят достойно и ты можешь туда попасть!

👋 Меня зовут Тихон, привет! Я — действующий Frontend-разработчик и ментор. Я за руку довожу до оффера на хорошую позицию в Big Tech и сопровождаю на испытательном сроке. Также из учеников я собираю комьюнити, где уже более 220 frontend-разработчиков🫂 А в своем канале: 👉Объясняю, как проходить HR-фильтр и превращать отклики в реальные приглашения 👉Помогаю найти мотивацию, борюсь убеждениями, которые мешают развиваться 👉На примерах объясняю, как проходить собеседования, включая техничку 👉Разбираю резюме и делюсь лайфхаками, например как аккуратно “пинговать” рекрутеров А еще регулярно публикую полезные материалы: ▪️Задачи, на которых валяться кандидаты ▪️База по микрофронтам ▪️Подборка из 100+ каналов с вакансиями для разработчиков ▪️100 вопросов, которые точно помогут тебе на собеседовании ▪️Чек лист проверки своего резюме А еще у меня множество успешных кейсов и отзывов, найти их можно в канале. Реклама, erid: 2W5zFJ5n8Em ИП Галактионов Тихон Витальевич, ИНН 771618975809

18 350

Аренда VPS/VDS-сервера. Виртуальные выделенные серверы в дата-центрах уровня Tier III — 7 готовых конфигураций от 200 ₽/мес. Преимущества аренды: - Выделенные ресурсы без переплаты; - KVM-виртуализация; - Быстрые NVMe SSD; - Соответствие 152-ФЗ, PCI DSS; - Бесплатная защита от DDoS; - Управление через панель, API и Terraform; - Техподдержка 24/7. Запустите сервер за несколько минут! Попробовать #реклама 16+ selectel.ru О рекламодателе

18 350

🤔 Как бы спроектировал приложение для автомобильного паркинга на Vue.js? - Компоненты: ParkingLot, ParkingSpot, VehicleInfo, AdminPanel; - Состояние: Vuex или Pinia для хранения статуса мест; - Реальное время: WebSocket или поллинг; - Маршруты: Vue Router; - UI: таблица с парковочными местами и кнопки действий. Ставь 👍 если знал ответ, 🔥 если нет Забирай 📚 Базу знаний

18 350

Не грузится? Понимаем. Бесплатный мессенджер для вашей компании - Битрикс24. Личные и групповые чаты, видеозвонки, каналы и нейросеть. Всё привычно и удобно. Начните работать на бесплатном тарифе уже сейчас. Узнать больше #реклама 16+ bitrix24.ru О рекламодателе

18 350

🤔 Как защитить Cookie от JavaScript? Если cookie содержит чувствительную информацию (например, auth_token), важно защитить его от доступа через JavaScript. Иначе злоумышленник может украсть его через XSS-атаку (Cross-Site Scripting). 🟠Используем флаг `HttpOnly` (основная защита) HttpOnly делает cookie недоступным для JavaScript (document.cookie).

Set-Cookie: auth_token=abc123; HttpOnly; Secure; SameSite=Strict

🟠Используем `Secure`, чтобы cookie передавались только по HTTPS Флаг Secure запрещает передачу cookie через HTTP, только HTTPS.

Set-Cookie: auth_token=abc123; Secure

🟠Используем `SameSite`, чтобы защититься от CSRF-атак SameSite=Strict или SameSite=Lax защищает от подделки запросов (CSRF).

Set-Cookie: auth_token=abc123; SameSite=Strict

🟠Не храним токены в cookie (если можно) Если возможно, используйте Authorization: Bearer заголовки вместо cookie.

Authorization: Bearer abc123

Ставь 👍 и забирай 📚 Базу знаний

18 350

🤔 Можно ли добавлять несколько заголовков h1? Можно, но только по смыслу: - В HTML5 допустимо несколько h1 — по одному на секцию или article. - Главное — сохранять логичную иерархию. Ставь 👍 если знал ответ, 🔥 если нет Забирай 📚 Базу знаний

18 350

Запустите рекламу в телеграм-каналах через Яндекс Директ Перфоманс-реклама в мессенджере продолжает работать: • Таргетинг по тематикам и регионам • Умный подбор каналов • Гибкие модели оплаты (CPC и CPV) Яндекс Директ знает, как привлечь целевую аудиторию 💰👌 Попробовать #реклама yandex.ru О рекламодателе

18 350

🤔 Что такое делегирование? Делегирование событий (Event Delegation) — это техника, при которой мы не навешиваем обработчик на каждый элемент, а ставим один обработчик на родителя и отслеживаем события его потомков. 🚩Как работает делегирование? Обычный способ (без делегирования) Если у нас есть 10 кнопок, мы можем повесить обработчик на каждую

document.querySelectorAll("button").forEach((btn) => {
  btn.addEventListener("click", () => {
    console.log("Кнопка нажата");
  });
});

Если кнопок 1000, это создаст 1000 обработчиков, что неэффективно. Если кнопки добавляются динамически (например, из API), обработчик на новые кнопки не сработает. 🟠Делегирование событий (оптимальный способ) Вместо того чтобы вешать обработчик на каждую кнопку, ставим один обработчик на родительский элемент и проверяем, кто вызвал событие:

document.getElementById("container").addEventListener("click", (event) => {
  if (event.target.tagName === "BUTTON") {
    console.log("Кнопка нажата:", event.target.textContent);
  }
});

🟠Пример с динамическими элементами Если мы добавляем кнопки динамически, обработчик все равно будет работать

document.getElementById("container").addEventListener("click", (event) => {
  if (event.target.classList.contains("btn")) {
    console.log("Нажата кнопка:", event.target.textContent);
  }
});

// Добавляем новую кнопку динамически
setTimeout(() => {
  const newButton = document.createElement("button");
  newButton.classList.add("btn");
  newButton.textContent = "Новая кнопка";
  document.getElementById("container").appendChild(newButton);
}, 2000);

Ставь 👍 и забирай 📚 Базу знаний

18 350

Аренда VPS/VDS сервера Серверы с гибкими настройками и готовые конфигурации с быстрым запуском Узнать больше #реклама 16+ firstvds.ru О рекламодателе

18 350

Главный навык на ближайшие годы — ВАЙБ-КОДИНГ ИИ уже пишет код, чинит баги, генерирует тесты, документацию и помогает запускать продукты быстрее, чем это делали классические команды разработки. И это уже не "будущее когда-нибудь", а реальность, которая меняет рынок уже сегодня И те, кто научится вайбкодить сейчас, будут увереннее конкурировать на рынке и зарабатывать больше тех, кто по-прежнему делает всё вручную. Стартовать с нуля поможет канал Вайб-кодинг. Там ребята круглосуточно мониторят более 320 российских и зарубежных источников и публикуют только главное: релизы, инструменты, гайды, курсы и практические кейсы. Подписывайтесь, нас уже 30 тысяч: @vibecoding_tg

18 350

"Рыцари и Принцессы": Восстановите своё королевство Атмосфера средних веков! Украшайте локации, открывайте земли, расширяйте владения. Играть #реклама 16+ yandex.ru О рекламодателе