Frontend Interview - собеседования по Javascript / Html / Css

Open in Telegram

Канал для подготовки к собеседованиям по фронтенду Админ, сотрудничество, реклама: @seniorFrontPromo, @maria_seniorfront Купить рекламу: https://telega.in/c/frontendinterview Канал в реестре РКН: https://rknn.link/su

Network:Senior Frontend - javascript, html, css Russia60 422 Technologies & Applications11 448...

📈 Analytical overview of Telegram channel Frontend Interview - собеседования по Javascript / Html / Css

Channel Frontend Interview - собеседования по Javascript / Html / Css (@frontendinterview) in the Russian language segment is an active participant. Currently, the community unites 10 798 subscribers, ranking 11 448 in the Technologies & Applications category and 60 422 in the Russia region.

📊 Audience metrics and dynamics

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

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

Verification status: Not verified
Engagement rate (ER): The average audience engagement rate is 9.60%. Within the first 24 hours after publication, content typically collects 4.17% reactions from the total number of subscribers.
Post reach: On average, each post receives 1 037 views. Within the first day, a publication typically gains 450 views.
Reactions and interaction: The audience actively supports content: the average number of reactions per post is 4.
Thematic interests: Content is focused on key topics such as javascript, браузер, html, css, видимость.

📝 Description and content policy

The author describes the resource as a platform for expressing subjective opinions:
“Канал для подготовки к собеседованиям по фронтенду Админ, сотрудничество, реклама: @seniorFrontPromo, @maria_seniorfront Купить рекламу: https://telega.in/c/frontendinterview Канал в реестре РКН: https://rknn.link/su”

Thanks to the high frequency of updates (latest data received on 25 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.

10 798

Subscribers

-524 hours

-187 days

-8530 days

1 037

Post views

~ 45024 hours

~ 55148 hours

9.60%

Engagement rate

No data

Posts per day

Ads index

beta

Posts Archive

10 798

overscroll-behavior Допустим, есть два вложенных друг в друга элемента. У обоих есть прокрутка. Если пользователь пролистает дочерний элемент, то при достижении его границы прокрутка перейдет на родительский элемент. Подобное поведение называется цепочкой прокрутки. В мобильных браузерах при достижении границы прокрутки контент элемента немного оттягивается в направлении скролла, создавая эффект отскока. Изменить поведение прокрутки в обоих примерах может свойство overscroll-behavior. С его помощью можно настроить прокрутку так, чтобы вложенные элементы не передавали скролл родителю, а страница не прыгала при достижении границ. Синтаксис свойства позволяет задать два значения — для оси x и оси y. Если указано одно значение, оно применится к обеим осям. Можно использовать самостоятельные CSS-свойства overscroll-behavior-x и overscroll-behavior-y для отдельных осей или их логические эквиваленты overscroll-behavior-inline, overscroll-behavior-block. Значения: - auto — значение по умолчанию. При достижении границы элемента создаётся цепочка прокрутки либо эффект отскока в зависимости от устройства; - contain — предотвращает создание цепочек прокрутки, но сохраняет эффект отскока; - none — отключает создание цепочек прокрутки и эффект отскока. 👉 @frontendInterview

10 798

Какой оператор JavaScript используется для проверки наличия свойства в объекте?

Anonymous voting

10 798

💬 Хочешь понять фронтенд и как проходят собеседования в IT? Привет! Веду блог о фронтенде, чтобы помогать тем, кто только начинает путь в IT. Здесь я делюсь опытом, разбираю темы, которые реально важны новичкам, и говорю по делу: — какие бывают собеседования и как к ним готовиться — как выбрать стек технологий под задачи — развеиваю мифы и заблуждения в IT — как не застрять на туториалах и начать делать Без надоевшего всем успешного успеха и гейткипинга. Только реальный опыт и советы, которые можно применить на практике. 📌 Подписывайся, если хочешь понимать, как развиваться во фронтенде. Да и просто, если тебе эта идея зашла! ➡️ Подписаться

10 798

В чём разница между макро и микро задачами ? Существует понятие Event Loop (цикл событий), который отвечает за выполнение кода, сбор событий и обработку сообщений. В его контексте важную роль играют понятия макро- и микрозадач. Эти типы задач помогают понять, как обрабатываются асинхронные операции. Макрозадачи (Macro-tasks): Это задачи, которые управляются циклом событий и выполняются одна за другой. Каждая такая задача выполняется в отдельном цикле, после чего выполняются все доступные микрозадачи. Примеры: - setTimeout - setInterval - setImmediate (Node.js) - Запросы к серверу через XMLHttpRequest или fetch (не сам запрос, а обработка результата) - I/O операции (в Node.js) Микрозадачи (Micro-tasks): Также управляются циклом событий, но они имеют более высокий приоритет, чем макрозадачи. Они выполняются сразу после завершения текущей исполняемой задачи и перед тем, как Event Loop перейдет к следующей макрозадаче. Это означает, что все они в очереди будут выполнены до начала выполнения следующей макрозадачи. Примеры: - Promise.then/catch/finally - queueMicrotask - MutationObserver Различия между макро и микрозадачами: - Приоритет: Микрозадачи имеют более высокий приоритет по сравнению с макрозадачами. Все микрозадачи в очереди будут выполнены до начала следующего цикла Event Loop и до того, как будет взята новая макрозадача. - Время выполнения: Микрозадачи выполняются непосредственно после текущей задачи и перед тем, как браузер получит возможность перерисовать страницу или обработать другие события, такие как ввод пользователя. Макрозадачи же разделяются циклами Event Loop. - Источники: Макро- и микрозадачи поступают из разных источников. Например, таймеры (setTimeout, setInterval) и I/O операции генерируют макрозадачи, в то время как обработчики промисов (then, catch, finally) создают микрозадачи. 👉 @frontendInterview

10 798

Это треугольник? Реализуйте функцию, принимающую 3 целых значения a, b, c. Функция должна возвращать true, если треугольник может быть построен со сторонами заданной длины, и false в любом другом случае. Пример: isTriangle(1,2,2) = true 👉 @frontendInterview

10 798

Packt.Learn.Three.js.pdf125.01 MB

10 798

Learn Three.js: Program 3D animations and visualizations for the web with JavaScript and WebGL Книга начинается с основных концепций и строительных блоков, используемых в Three.js, и помогает вам подробно изучить эти важные темы с помощью обширных примеров и образцов кода. Вы узнаете, как создавать реалистично выглядящие 3D-объекты с помощью текстур и материалов и как загружать модели из внешнего источника. 👉 @frontendInterview

10 798

Курсы JAVA-разработки Гарантия ЗП от 120 000р в договоре Jаvа — это язык, на котором строятся банковские системы, мобильные приложения, крупные веб-сервисы и многое другое, а спрос на Jаvа-разработчиков стабильно высок. Благодаря кроссплатформенности и надежности, ты сможешь работать в любой сфере IТ — от финансов до Коммерческой отрасли.📊💰 Почему это работает?✨ - Минимальные вложения. - Тысячи человек уже в IТ. Наши выпускники работают в крутых компаниях: от стартапов до международных корпораций. - Наши менторы — это опытные разработчики, которые ежедневно работают в IТ и готовы делиться актуальными знаниями. P.S. Если всё ещё сомневаешься и думаешь что будет сложно — просто попробуй.😊 Мы берем на себя все риски: ты оплачиваешь основную стоимость обучения только после успешного трудоустройства — это закреплено в договоре. Подать заявку #реклама 16+ kata.academy О рекламодателе

10 798

Как добавить слушатель события? Добавление слушателя события — это важный аспект работы с веб-приложениями, так как позволяет реагировать на действия пользователя, такие как клики, ввод текста, прокрутка и другие. В современных фреймворках и библиотеке JavaScript есть несколько способов добавить слушатели событий. Почему это нужно? Слушатели событий позволяют интерактивно реагировать на действия пользователей, делая приложения динамичными и отзывчивыми. Например, при клике на кнопку можно вызвать определенную функцию, при вводе текста в поле — обновить состояние и так далее. Как это используется? Рассмотрим три основных подхода к добавлению слушателей событий: в чистом JavaScript, в React и с использованием jQuery. Чистый JavaScript Для добавления слушателя события используется метод addEventListener. Пример:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Event Listener Example</title>
</head>
<body>
  <button id="myButton">Click me</button>

  <script>
    const button = document.getElementById('myButton');
    
    button.addEventListener('click', () => {
      alert('Button was clicked!');
    });
  </script>
</body>
</html>

В этом примере мы получаем элемент кнопки по её id и добавляем слушатель события click, который вызывает функцию, отображающую сообщение. React Обработчики событий добавляются непосредственно к JSX-элементам с использованием специальных атрибутов, таких как onClick, onChange и т.д. Пример:

import React from 'react';

function App() {
  const handleClick = () => {
    alert('Button was clicked!');
  };

  return (
    <div>
      <button onClick={handleClick}>Click me</button>
    </div>
  );
}

export default App;

В этом примере мы определяем функцию handleClick и передаем её в атрибут onClick кнопки. Когда пользователь нажимает на кнопку, вызывается функция handleClick. jQuery Если вы используете его, добавление слушателей событий также очень просто и удобно. Пример:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Event Listener Example</title>
  <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
</head>
<body>
  <button id="myButton">Click me</button>

  <script>
    $(document).ready(function() {
      $('#myButton').on('click', function() {
        alert('Button was clicked!');
      });
    });
  </script>
</body>
</html>

В этом примере мы используем jQuery для добавления обработчика события click к кнопке. Почему это удобно и важно: - Интерактивность: Позволяет создавать динамичные и отзывчивые интерфейсы. - Гибкость: Возможность реагировать на различные действия пользователей. - Удобство: В каждом подходе (чистый JavaScript, React, jQuery) есть свои удобства и особенности, которые помогают решать задачи более эффективно. 👉 @frontendInterview

10 798

Я: «Сегодня усердно поработаю.» Также я, через минуту после включения компа: 👉 @frontendInterview

10 798

Когда Web Worker автоматически уничтожается без вызова terminate()?

Anonymous voting

10 798

Как сделать мобильное приложение, если у тебя лапки? Путь от PWA до TWA Если вы веб-разработчик, но руки «чешутся» написать мобильное приложение, варианты есть. В этой статье я расскажу, как создать собственное прогрессивное веб-приложение (PWA) и доработать его до TWA, чтобы потом протестировать и опубликовать в разных сторах. Никакого rocket science, просто небольшое пособие, которое основывается на моем опыте. 👉 @frontendInterview

10 798

Я не гуру продакшена – я такой же новичок, как и ты Но вместе мы можем прокачаться быстрее! ✨ Основы продакшена ✨ Разборы треков ✨ Вдохновение и мысли Подписаться #реклама 16+ О рекламодателе

10 798

Как настроить баннер cookie-согласия по требованиям GDPR, Google Consent Mode и законодательства разных стран В современном вебе защита персональных данных – неотъемлемая часть ответственной разработки. Один из ключевых элементов – получение согласия пользователя на использование cookie-файлов. Несоблюдение этих требований может повлечь не только серьёзные штрафы, но и подорвать доверие аудитории. В этой статье мы разберём: - Зачем нужно согласие на cookie? - Какие бывают типы cookie? - Что такое Google Consent Mode? - Как реализовать баннер согласия? - Как управлять куки в зависимости от предпочтений пользователя? - Как проверить, что настройки согласия работают? А также приведем примеры политик использования файлов cookie. 👉 @frontendInterview

10 798

Принимаете платежи в криптовалюте? Если нет — то ваш ежегодный объем недополученной выручки может составлять до 15% от оборота Если да – вы продолжаете переплачить 1.5-3% на комиссиях Мы помогаем компаниям принимать оплату в USDT с минимальными комиссиями без посредников. CoinCrossPay — выгоднее, чем у конкурентов! ✅ Комиссия 0,02–0,09% — дешевле не бывает! – для любого бизнеса ✅ Крипта — напрямую вам. Без посредников. Полный контроль. ✅ Персональная платежная страница = больше продаж! ✅ Простая интеграция и поддержка 24/7 Кому подойдет? E-commerce, SaaS, freelancers, и т.д Подключите ❤️CoinCrossPay уже сегодня и увеличивайте продажи без лишних затрат! Оставь заявку на сайте: ➡️ CoinCrossPay.space Или напиши нам напрямую (предварительно расскажи нам о продукте): @CoinCross_manager

10 798

Высшее образование онлайн — поменяйте жизнь в 2025 году! ✅Набор в мае: от 6700 ₽/мес.* Московский технологический институт предлагает: — Высшее образование в московском вузе без выезда на сессии — Полностью дистанционный онлайн-формат — Возможность обучаться дома, на работе, в путешествии — Диплом государственного образца — Более 60 направлений на выбор (IT, инженерные, экономические, педагогические, управленческие и другие) — 5 способов оплаты обучения — Поддержка персонального куратора: от поступления до получения диплома Узнать больше #реклама 16+ mti-vuz.ru О рекламодателе

10 798

Как сделать параметр необязательным в TypeScript?

Anonymous voting

10 798

👩‍💻 Всем программистам посвящается! Вот 17 авторских обучающих IT каналов по самым востребованным областям программирования: Выбирай своё направление: 👩‍💻 Frontend — t.me/frontend_ready 📱 JavaScript — t.me/javascript_ready 👩‍💻 Backend — t.me/backend_ready 📱 GitHub — t.me/github_ready 👩‍💻 Python — t.me/python_ready 👩‍💻 Java — t.me/java_ready 👩‍💻 Всё IT — t.me/it_ready 🖥 Базы Данных & SQL — t.me/sql_ready 👩‍💻 C/C++ — https://t.me/cpp_ready 👩‍💻 C# & Unity — t.me/csharp_ready 🖼️ DevOps — t.me/devops_ready 🤔 Хакинг & ИБ — t.me/hacking_ready 👩‍💻 Linux — t.me/linux_ready 👩‍💻 Bash & Shell — t.me/bash_ready 👩‍💻 Нейросети — t.me/neuro_ready 📖 IT Книги — t.me/books_ready 🖥 Design — t.me/design_ready 📌 Гайды, шпаргалки, задачи, ресурсы и фишки для каждого языка программирования!

10 798

Что делает $emit во Vue? $emit — это метод, используемый для отправки событий из дочернего компонента в родительский компонент. Он позволяет дочернему компоненту уведомлять родительский компонент о том, что что-то произошло, передавая вместе с этим событием любые необходимые данные. Как его использовать 1. В дочернем компоненте: - Используйте метод $emit, чтобы отправить событие. - Передайте имя события и любые данные, которые нужно передать родительскому компоненту. 2. В родительском компоненте: - Слушайте это событие, используя директиву v-on или её сокращение @. - Обработайте событие в методе родительского компонента. Дочерний компонент (ChildComponent.vue)

<template>
  <button @click="notifyParent">Нажми меня</button>
</template>

<script>
export default {
  methods: {
    notifyParent() {
      this.$emit('childClicked', 'Данные от дочернего компонента');
    }
  }
}
</script>

Родительский компонент (ParentComponent.vue)

<template>
  <div>
    <h1>Родительский компонент</h1>
    <child-component @childClicked="handleChildClick"></child-component>
  </div>
</template>

<script>
import ChildComponent from './ChildComponent.vue';

export default {
  components: {
    ChildComponent
  },
  methods: {
    handleChildClick(message) {
      console.log('Событие от дочернего компонента:', message);
    }
  }
}
</script>

Пояснение 1. В дочернем компоненте `ChildComponent`: - Мы создали кнопку и добавили к ней обработчик события @click, который вызывает метод notifyParent. - Метод notifyParent использует $emit для отправки события childClicked и передает строку 'Данные от дочернего компонента' в качестве данных. 2. В родительском компоненте ParentComponent: - Мы добавили дочерний компонент <child-component> в шаблон и прослушиваем событие childClicked с помощью директивы @childClicked. - Когда событие childClicked происходит, вызывается метод handleChildClick, который принимает данные, переданные дочерним компонентом, и выводит их в консоль. Почему это важно? - Коммуникация между компонентами: $emit позволяет организовать эффективную коммуникацию между компонентами, передавая данные и уведомления от дочернего компонента к родительскому. - Разделение обязанностей: С помощью событий можно поддерживать чистую и разделенную архитектуру, где каждый компонент отвечает только за свои задачи и уведомляет другие компоненты о произошедших изменениях через события. - Масштабируемость и поддерживаемость: Использование событий делает приложение более масштабируемым и поддерживаемым, так как компоненты остаются независимыми и могут повторно использоваться в разных частях приложения. 👉 @frontendInterview

10 798

Чемпионат для подростков по 12 направлениям от «Алабуга Политех»☺️ Программирование и Битва роботов, Экономика и Юриспруденция, 3D моделирование и Английский язык и многое другое, чтобы каждый нашел свою дисциплину. Для участия тебе нужно☺️ ☺️Оставь заявку на сайте😀 ☺️Пройди заочный этап на HR-платформе: Business Cats до 1,0 по «Общению» и «Аналитике» для оплаты дороги туда и обратно😀 ☺️Приезжай на чемпионат😀 Мы предлагаем тебе☺️ ☺️Общий призовой фонд турнира составляет 1 000 000 рублей😀 ☺️Проживание и дорога бесплатно😀 ☺️Возможность поступить в «Алабуга Политех»😀 Участвуй в турнире от образовательного центра мирового уровня и получай призы и преимущество в поступлении☺️