📈 Telegram kanali Frontend | Вопросы собесов analitikasi
Frontend | Вопросы собесов (@easy_javascript_ru) Rus til segmentidagi kanali faol ishtirokchi. Hozirda hamjamiyat 17 430 obunachidan iborat bo'lib, Texnologiyalar & Aralashmalar toifasida 7 459-o'rinni va Rossiya mintaqasida 37 727-o'rinni egallagan.
📊 Auditoriya ko‘rsatkichlari va dinamika
невідомо sanasidan buyon loyiha tez o‘sib, 17 430 obunachiga ega bo‘ldi.
29 Oktabr, 2026 dagi oxirgi ma’lumotlarga ko‘ra kanal barqaror faollikka ega. Oxirgi 30 kunda obunachilar soni -230 ga, so‘nggi 24 soatda esa -11 ga o‘zgardi va umumiy qamrov yuqori darajada qolmoqda.
Tasdiqlash holati: Tasdiqlanmagan
Jalb etish (ER): Auditoriya o‘rtacha 6.92% darajada jalb etiladi. Nashrdan keyingi dastlabki 24 soatda kontent odatda umumiy obunachilar sonining 4.34% ini tashkil etuvchi reaksiyalarni to‘playdi.
Post qamrovi: Har bir post o‘rtacha 1 206 marta ko‘riladi; birinchi sutkada odatda 757 ta ko‘rish yig‘iladi.
Reaksiyalar va o‘zaro ta’sir: Auditoriya faol: har bir postga o‘rtacha 4 ta reaksiya keladi.
Tematik yo‘nalishlar: Kontent ставь, браузер, html, border, flex kabi asosiy mavzularga jamlangan.
📝 Tavsif va kontent siyosati
Muallif resursni shaxsiy fikrni ifoda etish maydoni sifatida ta’riflaydi: “Сайт: https://easyoffer.ru/
Все каналы: t.me/+xGeAw6ckJ4liYzQy
Контакт для рекламы: @sendme_ads”
Yuqori yangilanish chastotasi (oxirgi ma’lumot 30 Oktabr, 2026 da olingan) sababli kanal doimo dolzarb va katta qamrovli bo‘lib qoladi. Analitika auditoriya kontent bilan faol hamkorlik qilishini, uni Texnologiyalar & Aralashmalar toifasidagi muhim ta’sir nuqtasiga aylantirishini ko‘rsatadi.
\n\nСтавь 👍 и забирай 📚 Базу знаний","datePublished":"2026-03-21T09:06:47Z","dateModified":"2026-03-21T09:06:47Z","author":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru","image":"https://img.telemetr.io/c/25KaBb/5431453649143450783?ty=x"},"publisher":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru","image":"https://img.telemetr.io/c/25KaBb/5431453649143450783?ty=x"},"commentCount":0,"interactionStatistic":[{"@type":"InteractionCounter","interactionType":"https://schema.org/ViewAction","userInteractionCount":2010},{"@type":"InteractionCounter","interactionType":"https://schema.org/LikeAction","userInteractionCount":4},{"@type":"InteractionCounter","interactionType":"https://schema.org/ShareAction","userInteractionCount":16}]}},{"@type":"ListItem","position":4,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/2481","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/2481","mainEntityOfPage":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/2481","headline":"🤔 Как организовать код (Module Pattern, наследование)? - Module Pattern: используется для инкапсуляции кода,…","articleBody":"🤔 Как организовать код (Module Pattern, наследование)?\n\n- Module Pattern: используется для инкапсуляции кода, скрытия деталей реализации и создания чистых API. Обычно основан на IIFE и возвращает объект с публичными методами.\n- Наследование: в JS можно использовать прототипное наследование (через Object.create или классы), чтобы передавать поведение от одного объекта к другому. Это упрощает переиспользование кода.\n\nСтавь 👍 если знал ответ, 🔥 если нет\nЗабирай 📚 Базу знаний","datePublished":"2026-03-20T16:11:43Z","dateModified":"2026-03-20T16:11:43Z","author":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru","image":"https://img.telemetr.io/c/25KaBb/5431453649143450783?ty=x"},"publisher":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru","image":"https://img.telemetr.io/c/25KaBb/5431453649143450783?ty=x"},"commentCount":0,"interactionStatistic":[{"@type":"InteractionCounter","interactionType":"https://schema.org/ViewAction","userInteractionCount":1827},{"@type":"InteractionCounter","interactionType":"https://schema.org/LikeAction","userInteractionCount":4},{"@type":"InteractionCounter","interactionType":"https://schema.org/ShareAction","userInteractionCount":4}]}},{"@type":"ListItem","position":5,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/2480","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/2480","mainEntityOfPage":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/2480","headline":"🤔 Как достигается изоляция при использовании бэм? БЭМ (Блок, Элемент, Модификатор) достигает изоляции стилей…","articleBody":"🤔 Как достигается изоляция при использовании бэм?\n\nБЭМ (Блок, Элемент, Модификатор) достигает изоляции стилей с помощью уникальных имен классов. Это помогает избежать конфликтов между стилями и делает код более предсказуемым. \n\n🚩Как БЭМ предотвращает конфликты? \n\n🟠Все стили зависят только от конкретного блока \nВ БЭМ нет зависимостей от родительских элементов, поэтому стили блока не сломаются, если он окажется в другом месте. \n
Кнопка
\n.button {\n background: blue;\n color: white;\n}\n\nПлохой пример без БЭМ \n.container .button {\n background: blue;\n}\n\n🟠Элементы (`__`) зависят только от своего блока \nСтили элемента никогда не зависят от родителя — только от блока. \n
\n
Заголовок
\n
Текст карточки
\n
\n.card__title {\n font-size: 20px;\n}\n\n.card__text {\n color: gray;\n}\n\n🟠Модификаторы (`--`) изменяют только нужные стили \nМодификаторы позволяют изменять внешний вид без переписывания базовых стилей. \n\n\n.button {\n padding: 10px;\n border-radius: 5px;\n}\n\n.button--red {\n background: red;\n}\n\n.button--blue {\n background: blue;\n}\n\n🟠Имена классов уникальны, нет глобальных стилей \nВ БЭМ не используется tag {} или id {} — только классы. Это предотвращает конфликты стилей. \nh1 {\n color: red;\n}\n\nБЭМ-версия \n.card__title {\n color: red;\n}\n\nСтавь 👍 и забирай 📚 Базу знаний","datePublished":"2026-03-20T09:06:47Z","dateModified":"2026-03-20T09:06:47Z","author":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru","image":"https://img.telemetr.io/c/25KaBb/5431453649143450783?ty=x"},"publisher":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru","image":"https://img.telemetr.io/c/25KaBb/5431453649143450783?ty=x"},"commentCount":0,"interactionStatistic":[{"@type":"InteractionCounter","interactionType":"https://schema.org/ViewAction","userInteractionCount":1831},{"@type":"InteractionCounter","interactionType":"https://schema.org/LikeAction","userInteractionCount":5},{"@type":"InteractionCounter","interactionType":"https://schema.org/ShareAction","userInteractionCount":14}]}},{"@type":"ListItem","position":6,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/2479","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/2479","mainEntityOfPage":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/2479","headline":"Битва кейсов ИБ: 6 сценариев киберкошмара 7 апреля в поединке сойдутся эксперты «Солара». По одну сторону — к…","articleBody":"Битва кейсов ИБ: 6 сценариев киберкошмара\n\n7 апреля в поединке сойдутся эксперты «Солара». \n\nПо одну сторону — кейсы тестирований на проникновение, по другую — реальные атаки. \n\nЧьи сценарии окажутся страшнее и критичнее — покажет битва.\n\nКому будет полезно:\n\nРуководителям ИБ и ИБ-специалистам — получить данные, чтобы обосновать бюджет и построить стратегию защиты.\nИТ-руководителям и менеджерам — узнать о текущих рисках и понять, как спланировать ИБ-бюджет.\nРуководителям компаний и риск-менеджерам — снизить цифровые и финансовые риски, защитить репутацию.\n\nПриходите, чтобы на чужих ошибках закрыть пробелы в своей защите. \n\nЗарегистрироваться\n\n#реклама 16+\nrt-solar.ru\nО рекламодателе","datePublished":"2026-03-20T03:47:20Z","dateModified":"2026-03-22T01:54:02Z","author":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru","image":"https://img.telemetr.io/c/25KaBb/5431453649143450783?ty=x"},"publisher":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru","image":"https://img.telemetr.io/c/25KaBb/5431453649143450783?ty=x"},"commentCount":0,"interactionStatistic":[{"@type":"InteractionCounter","interactionType":"https://schema.org/ViewAction","userInteractionCount":1216}]}},{"@type":"ListItem","position":7,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/2478","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/2478","mainEntityOfPage":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/2478","headline":"🤔 Как принудительно обновить компонент во Vue? Иногда Vue может не понять, что данные изменились. В таком слу…","articleBody":"🤔 Как принудительно обновить компонент во Vue?\n\nИногда Vue может не понять, что данные изменились. В таком случае можно заставить компонент перерисоваться. Один способ — изменить значение key у компонента, это заставит его перерисоваться заново. Также можно использовать локальное реактивное состояние, которое сбрасывается и снова включает компонент. В крайнем случае используют forceUpdate, но это плохая практика.\n\nСтавь 👍 если знал ответ, 🔥 если нет\nЗабирай 📚 Базу знаний","datePublished":"2026-03-19T16:10:42Z","dateModified":"2026-03-19T16:10:42Z","author":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru","image":"https://img.telemetr.io/c/25KaBb/5431453649143450783?ty=x"},"publisher":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru","image":"https://img.telemetr.io/c/25KaBb/5431453649143450783?ty=x"},"commentCount":0,"interactionStatistic":[{"@type":"InteractionCounter","interactionType":"https://schema.org/ViewAction","userInteractionCount":1792},{"@type":"InteractionCounter","interactionType":"https://schema.org/LikeAction","userInteractionCount":9},{"@type":"InteractionCounter","interactionType":"https://schema.org/ShareAction","userInteractionCount":5}]}},{"@type":"ListItem","position":8,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/2477","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/2477","mainEntityOfPage":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/2477","headline":"🤔 Зачем нужен eslint? ESLint – это инструмент для автоматического анализа и исправления кода в JavaScript и T…","articleBody":"🤔 Зачем нужен eslint?\n\nESLint – это инструмент для автоматического анализа и исправления кода в JavaScript и TypeScript. Он помогает разработчикам следовать единым стилям кодирования, находить ошибки и предотвращать баги ещё до запуска кода. \n\n🚩Почему ESLint полезен? \nБез линтера код может быть неаккуратным и содержать ошибки, которые сложно отловить. \n\n🚩Проблемы без ESLint \n\nРазные стили написания кода \nПропущенные точки с запятой или лишние пробелы \nНеиспользуемые переменные \nОшибки, которые не выявляются во время компиляции (например, undefined переменные) \n\n🚩Решение с ESLint: \n\nАвтоматически находит ошибки и предупреждения \nПодсказывает лучшие практики \nПоддерживает кастомные правила \nРаботает в IDE и CI/CD (автоматическая проверка) \n\n🟠Как ESLint работает? \nESLint использует набор правил, которые проверяют код. Если код нарушает эти правила – линтер выдаёт предупреждение или ошибку. \nfunction sayHello(name) {\n console.log(\"Hello, \" + name)\n}\n\nsayHello(\"John\")\n\n\nПример исправленного кода (ESLint fix) \nfunction sayHello(name) {\n console.log(`Hello, ${name}`);\n}\n\nsayHello(\"John\");\n\n🟠Как установить и настроить ESLint? \nУстановка \nnpm install eslint --save-dev\n\nСоздание конфига \nnpx eslint --init\n\nПример .eslintrc.js (настройки ESLint) \nmodule.exports = {\n env: {\n browser: true,\n es6: true,\n },\n extends: [\n \"eslint:recommended\", // Базовые рекомендации\n \"plugin:vue/vue3-recommended\" // Рекомендации для Vue\n ],\n rules: {\n \"no-unused-vars\": \"warn\", // Предупреждать о неиспользуемых переменных\n \"semi\": [\"error\", \"always\"], // Обязательные точки с запятой\n \"quotes\": [\"error\", \"double\"], // Только двойные кавычки\n },\n};\n\nЗапуск проверки кода \nnpx eslint myfile.js\n\nАвтоматическое исправление ошибок \nnpx eslint myfile.js --fix\n\n🟠ESLint в IDE (VS Code, WebStorm) \nЧтобы ESLint работал в VS Code, установите расширение ESLint и включите \"editor.codeActionsOnSave\" \n\"editor.codeActionsOnSave\": {\n \"source.fixAll.eslint\": true\n}\n\n🟠ESLint в CI/CD (автоматическая проверка на сервере) \nВ проектах ESLint можно запускать в GitHub Actions, Jenkins, GitLab CI и других CI/CD системах, чтобы не допускать ошибок в main ветку. \n\"scripts\": {\n \"lint\": \"eslint src --fix\"\n}\n\nТеперь перед коммитом можно запускать: \nnpm run lint\n\nСтавь 👍 и забирай 📚 Базу знаний","datePublished":"2026-03-19T09:05:41Z","dateModified":"2026-03-19T09:05:41Z","author":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru","image":"https://img.telemetr.io/c/25KaBb/5431453649143450783?ty=x"},"publisher":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru","image":"https://img.telemetr.io/c/25KaBb/5431453649143450783?ty=x"},"commentCount":0,"interactionStatistic":[{"@type":"InteractionCounter","interactionType":"https://schema.org/ViewAction","userInteractionCount":1877},{"@type":"InteractionCounter","interactionType":"https://schema.org/LikeAction","userInteractionCount":7},{"@type":"InteractionCounter","interactionType":"https://schema.org/ShareAction","userInteractionCount":22}]}},{"@type":"ListItem","position":9,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/2476","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/2476","mainEntityOfPage":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/2476","headline":"🤔 Какие есть способы модификации цвета? Можно изменить прозрачность, использовать фильтры, градиенты, наложен…","articleBody":"🤔 Какие есть способы модификации цвета?\n\nМожно изменить прозрачность, использовать фильтры, градиенты, наложения и тени. Также можно программно управлять цветом, меняя его тон, насыщенность, яркость через функции препроцессоров или CSS-функции.\n\nСтавь 👍 если знал ответ, 🔥 если нет\nЗабирай 📚 Базу знаний","datePublished":"2026-03-18T16:10:43Z","dateModified":"2026-03-18T16:10:43Z","author":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru","image":"https://img.telemetr.io/c/25KaBb/5431453649143450783?ty=x"},"publisher":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru","image":"https://img.telemetr.io/c/25KaBb/5431453649143450783?ty=x"},"commentCount":0,"interactionStatistic":[{"@type":"InteractionCounter","interactionType":"https://schema.org/ViewAction","userInteractionCount":1880},{"@type":"InteractionCounter","interactionType":"https://schema.org/LikeAction","userInteractionCount":5},{"@type":"InteractionCounter","interactionType":"https://schema.org/ShareAction","userInteractionCount":3}]}},{"@type":"ListItem","position":10,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/2475","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/2475","mainEntityOfPage":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/2475","headline":"🤔 Зачем нам разбивать приложение отдельно на backend и frontend? Разделение на Frontend (клиент) и Backend (с…","articleBody":"🤔 Зачем нам разбивать приложение отдельно на backend и frontend?\n\nРазделение на Frontend (клиент) и Backend (сервер) – это стандартный подход в современной веб-разработке. Это делает приложение гибче, масштабируемее и удобнее в разработке. \n\n🚩Почему лучше разделять? \n\n🟠Гибкость и масштабируемость\nМожно менять Frontend и Backend независимо. \nМожно использовать разные технологии (например, Vue.js + Django). \nМожно легко разделить команды разработчиков. \n\n🟠Повышенная безопасность \nFrontend не имеет доступа к базе данных. \nВсе важные вычисления, авторизация, хранение данных происходят на сервере. \nAPI можно защитить токенами (JWT, OAuth). \n\n🟠Уменьшение нагрузки на клиент \nЛогика обработки данных выполняется на сервере. \nКлиент получает уже готовые данные, а не загружает огромные файлы. \n\n🟠Легче разрабатывать и тестировать \nМожно разрабатывать Frontend и Backend независимо. \nМожно подменять сервер на mock-данные во время разработки. \n\n🚩Как они общаются? (REST API & GraphQL)\nРазделённые приложения общаются через API: \nREST API (GET, POST, PUT, DELETE) \nGraphQL API (запросы только нужных данных) \nWebSockets (реальное время, чаты, онлайн-игры) \nGET https://api.example.com/users\n\nОтвет от Backend \n[\n { \"id\": 1, \"name\": \"Alice\" },\n { \"id\": 2, \"name\": \"Bob\" }\n]\n\nСтавь 👍 и забирай 📚 Базу знаний","datePublished":"2026-03-18T09:05:42Z","dateModified":"2026-03-18T09:05:42Z","author":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru","image":"https://img.telemetr.io/c/25KaBb/5431453649143450783?ty=x"},"publisher":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru","image":"https://img.telemetr.io/c/25KaBb/5431453649143450783?ty=x"},"commentCount":0,"interactionStatistic":[{"@type":"InteractionCounter","interactionType":"https://schema.org/ViewAction","userInteractionCount":2173},{"@type":"InteractionCounter","interactionType":"https://schema.org/LikeAction","userInteractionCount":10},{"@type":"InteractionCounter","interactionType":"https://schema.org/ShareAction","userInteractionCount":11}]}},{"@type":"ListItem","position":11,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/2474","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/2474","mainEntityOfPage":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/2474","headline":"Нейросеть проверит 100% закупок на стройке за минуты! 👍Контроль закупок за 15 минут в день. Нейросеть \"Тринит…","articleBody":"Нейросеть проверит 100% закупок на стройке за минуты!\n\n👍Контроль закупок за 15 минут в день. Нейросеть \"Тринити\" экономит ваше время и миллионы рублей\n\nВы - генеральный директор строительной компании, и у вас катастрофически не хватает времени? Работаете 12+ часов в день и не можете контролировать каждую закупку?\n\n💰Тратите миллионы на закупки, но не уверены, что получаете лучшие цены и качество? Хотите спать спокойно, зная, что ваши деньги под защитой?\n\nПросто загрузите счет или тендерный протокол в Telegram-бот\nПолучите детальный анализ по 18 параметрам за 1 минуту\nЭкономьте до 10% на каждой закупке без дополнительных усилий\n\nВ 3-5 раз дешевле, чем содержать штат контролеров! Работает 24/7 без выходных и отпусков.\n👌Узнайте про наш телеграм-бот и тестируйте бесплатно 7 дней! Экономия в первый же день. \n\nПерейти на сайт\n\n#реклама 16+\ntrinitysafe.ru\nО рекламодателе","datePublished":"2026-03-18T02:31:54Z","dateModified":"2026-03-20T00:41:39Z","author":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru","image":"https://img.telemetr.io/c/25KaBb/5431453649143450783?ty=x"},"publisher":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru","image":"https://img.telemetr.io/c/25KaBb/5431453649143450783?ty=x"},"commentCount":0,"interactionStatistic":[{"@type":"InteractionCounter","interactionType":"https://schema.org/ViewAction","userInteractionCount":1350},{"@type":"InteractionCounter","interactionType":"https://schema.org/LikeAction","userInteractionCount":1}]}},{"@type":"ListItem","position":12,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/2473","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/2473","mainEntityOfPage":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/2473","headline":"🤔 Как заредиректить пользователя на URL? Можно изменить свойство, отвечающее за текущий адрес страницы, или в…","articleBody":"🤔 Как заредиректить пользователя на URL?\n\nМожно изменить свойство, отвечающее за текущий адрес страницы, или вызвать метод, который вызывает загрузку другого URL. Это работает как обычный переход по ссылке.\n\nСтавь 👍 если знал ответ, 🔥 если нет\nЗабирай 📚 Базу знаний","datePublished":"2026-03-17T16:10:41Z","dateModified":"2026-03-17T16:10:41Z","author":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru","image":"https://img.telemetr.io/c/25KaBb/5431453649143450783?ty=x"},"publisher":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru","image":"https://img.telemetr.io/c/25KaBb/5431453649143450783?ty=x"},"commentCount":0,"interactionStatistic":[{"@type":"InteractionCounter","interactionType":"https://schema.org/ViewAction","userInteractionCount":1873},{"@type":"InteractionCounter","interactionType":"https://schema.org/LikeAction","userInteractionCount":8},{"@type":"InteractionCounter","interactionType":"https://schema.org/ShareAction","userInteractionCount":2}]}},{"@type":"ListItem","position":13,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/2472","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/2472","mainEntityOfPage":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/2472","headline":"🤔 Что такое шаблонные литералы, и для чего они нужны? Были введены в ECMAScript 2015 (ES6) и представляют соб…","articleBody":"🤔 Что такое шаблонные литералы, и для чего они нужны? \n\nБыли введены в ECMAScript 2015 (ES6) и представляют собой улучшение стандартных строк в JavaScript. Они облегчают работу с строками, предоставляя более удобный синтаксис для создания многострочных строк, интерполяции переменных и встроенных выражений.\n\n🚩Примеры использования\n\n🟠Интерполяция переменных и выражений\nШаблонные литералы позволяют встраивать переменные и выражения внутрь строк с помощью синтаксиса ${}.\nconst name = 'Alice';\nconst age = 25;\n\nconst greeting = `Hello, my name is ${name} and I am ${age} years old.`;\n\nconsole.log(greeting);\n// Вывод: Hello, my name is Alice and I am 25 years old.\n\n🟠Многострочные строки\nШаблонные литералы позволяют создавать многострочные строки без необходимости использования символов переноса строки (\\n).\nconst multiLineString = `This is a string\nthat spans across\nmultiple lines.`;\n\nconsole.log(multiLineString);\n// Вывод:\n// This is a string\n// that spans across\n// multiple lines.\n\n🟠Встроенные выражения\nВнутри шаблонных литералов можно использовать любые JavaScript-выражения.\nconst a = 5;\nconst b = 10;\n\nconst result = `The sum of ${a} and ${b} is ${a + b}.`;\n\nconsole.log(result);\n// Вывод: The sum of 5 and 10 is 15.\n\n🟠Вызов функций внутри шаблонных литералов\nМожно вызывать функции и методы внутри шаблонных литералов.\nfunction toUpperCase(str) {\n return str.toUpperCase();\n}\n\nconst name = 'Alice';\n\nconst loudGreeting = `Hello, ${toUpperCase(name)}!`;\n\nconsole.log(loudGreeting);\n// Вывод: Hello, ALICE!\n\n🟠Тегированные шаблонные литералы\nТегированные шаблонные литералы позволяют обработать строку с помощью функции перед ее окончательной интерпретацией.\nfunction tag(strings, ...values) {\n console.log(strings);\n console.log(values);\n return 'Tagged template';\n}\n\nconst name = 'Alice';\nconst age = 25;\n\nconst taggedResult = tag`Name: ${name}, Age: ${age}`;\n\nconsole.log(taggedResult);\n// Вывод:\n// [ 'Name: ', ', Age: ', '' ]\n// [ 'Alice', 25 ]\n// Tagged template\n\nСтавь 👍 и забирай 📚 Базу знаний","datePublished":"2026-03-17T09:05:39Z","dateModified":"2026-03-17T09:05:39Z","author":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru","image":"https://img.telemetr.io/c/25KaBb/5431453649143450783?ty=x"},"publisher":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru","image":"https://img.telemetr.io/c/25KaBb/5431453649143450783?ty=x"},"commentCount":0,"interactionStatistic":[{"@type":"InteractionCounter","interactionType":"https://schema.org/ViewAction","userInteractionCount":2066},{"@type":"InteractionCounter","interactionType":"https://schema.org/LikeAction","userInteractionCount":13},{"@type":"InteractionCounter","interactionType":"https://schema.org/ShareAction","userInteractionCount":11}]}},{"@type":"ListItem","position":14,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/2471","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/2471","mainEntityOfPage":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/2471","headline":"Увеличьте память телефона до бесконечности Безлимитное место для фото и видео с телефона в Облаке — 3 месяца…","articleBody":"Увеличьте память телефона до бесконечности\n\nБезлимитное место для фото и видео с телефона в Облаке — 3 месяца за 0 ₽\nНезаменимо, когда память телефона переполнена, а нужно фотографировать прямо сейчас \n\nУзнать больше\n\n#реклама 16+\ncloud.mail.ru\nО рекламодателе","datePublished":"2026-03-16T21:35:58Z","dateModified":"2026-03-18T20:06:23Z","author":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru","image":"https://img.telemetr.io/c/25KaBb/5431453649143450783?ty=x"},"publisher":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru","image":"https://img.telemetr.io/c/25KaBb/5431453649143450783?ty=x"},"commentCount":0,"interactionStatistic":[{"@type":"InteractionCounter","interactionType":"https://schema.org/ViewAction","userInteractionCount":1422},{"@type":"InteractionCounter","interactionType":"https://schema.org/LikeAction","userInteractionCount":2}]}},{"@type":"ListItem","position":15,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/2470","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/2470","mainEntityOfPage":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/2470","headline":"🤔 Что такое псевдоэлемент? Псевдоэлемент — это CSS-конструкция, которая позволяет стилизовать определённые ча…","articleBody":"🤔 Что такое псевдоэлемент?\n\nПсевдоэлемент — это CSS-конструкция, которая позволяет стилизовать определённые части элемента, например, ::before для добавления контента перед элементом или ::after для добавления после. Это удобно для оформления, не изменяя HTML-структуру.\n\nСтавь 👍 если знал ответ, 🔥 если нет\nЗабирай 📚 Базу знаний","datePublished":"2026-03-16T16:10:42Z","dateModified":"2026-03-16T16:10:42Z","author":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru","image":"https://img.telemetr.io/c/25KaBb/5431453649143450783?ty=x"},"publisher":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru","image":"https://img.telemetr.io/c/25KaBb/5431453649143450783?ty=x"},"commentCount":0,"interactionStatistic":[{"@type":"InteractionCounter","interactionType":"https://schema.org/ViewAction","userInteractionCount":2051},{"@type":"InteractionCounter","interactionType":"https://schema.org/LikeAction","userInteractionCount":9},{"@type":"InteractionCounter","interactionType":"https://schema.org/ShareAction","userInteractionCount":3}]}},{"@type":"ListItem","position":16,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/2469","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/2469","mainEntityOfPage":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/2469","headline":"🤔 Как считается вес селектора? Вес селектора (специфичность) – это правило, по которому браузер определяет, к…","articleBody":"🤔 Как считается вес селектора?\n\nВес селектора (специфичность) – это правило, по которому браузер определяет, какой стиль применить, если есть несколько конфликтующих селекторов. \n( inline, id, class/атрибут/псевдокласс, элемент/псевдоэлемент )\n\nПример\n/* Специфичность: (0, 1, 0, 0) */\n#header { color: red; }\n\n/* Специфичность: (0, 0, 1, 0) */\n.header { color: blue; }\n\n/* Специфичность: (0, 0, 0, 1) */\nh1 { color: green; }\n\n🟠Примеры сравнения специфичности \nПример 1\nh1 { color: red; } /* (0,0,0,1) */\n.title { color: blue; } /* (0,0,1,0) */\n\nПример 2\nh1 { color: red; } /* (0,0,0,1) */\n#main { color: blue; } /* (0,1,0,0) */\n\nПример 3 (комбинированные селекторы)\nh1.title { color: red; } /* (0,0,1,1) */\n#main h1 { color: blue; } /* (0,1,0,1) */\n\nПример 4 (инлайн-стиль всегда сильнее)\n
Заголовок
\nh1 { color: red; } /* (0,0,0,1) */\n.title { color: blue; } /* (0,0,1,0) */\n#main { color: purple; } /* (0,1,0,0) */\n\n🟠Как повысить вес селектора? \nДобавить ID (но не злоупотреблять). Использовать более специфичные селекторы (например, .header h1 вместо h1). Использовать !important (но осторожно!). \nh1 { color: red !important; } /* Всегда будет красным */\n\nСтавь 👍 и забирай 📚 Базу знаний","datePublished":"2026-03-16T09:05:41Z","dateModified":"2026-03-16T09:05:41Z","author":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru","image":"https://img.telemetr.io/c/25KaBb/5431453649143450783?ty=x"},"publisher":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru","image":"https://img.telemetr.io/c/25KaBb/5431453649143450783?ty=x"},"commentCount":0,"interactionStatistic":[{"@type":"InteractionCounter","interactionType":"https://schema.org/ViewAction","userInteractionCount":2200},{"@type":"InteractionCounter","interactionType":"https://schema.org/LikeAction","userInteractionCount":5},{"@type":"InteractionCounter","interactionType":"https://schema.org/ShareAction","userInteractionCount":11}]}},{"@type":"ListItem","position":17,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/2468","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/2468","mainEntityOfPage":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/2468","headline":"Бесплатная конференция по PostgreSQL — уже 19 марта! Регистрируйся на бесплатную конференцию по PostgreSQL —…","articleBody":"Бесплатная конференция по PostgreSQL — уже 19 марта!\n\nРегистрируйся на бесплатную конференцию по PostgreSQL — 19.03.2026.\nВ фокусе — практический опыт эксплуатации PostgreSQL, ее внутреннее устройство, производительность, взаимодействие с другими системами и реальные кейсы из highload-среды. \n\nМероприятие в формате онлайн+офлайн, 25+ тематических докладов, 3 потока.\n\nВот некоторые темы конференции:\n✅ Опыт выноса OLAP-нагрузки на реплику\n✅ Временные таблицы в PostgreSQL: почему это критично для платформы 1С и что можно улучшить\n✅ Разделение Compute и Storage: архитектурный прорыв для PostgreSQL в облаке\n✅ Highload «из ниоткуда»: когда узкое место — не в СУБД, а в клиентской архитектуре\n✅ Работа с логами PostgreSQL\n\nРегистрируйся, будет интересно!\nИ бесплатно! \n\nЗарегистрироваться\n\n#реклама 16+\npgbootcamp.ru\nО рекламодателе","datePublished":"2026-03-15T18:40:14Z","dateModified":"2026-03-17T17:04:02Z","author":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru","image":"https://img.telemetr.io/c/25KaBb/5431453649143450783?ty=x"},"publisher":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru","image":"https://img.telemetr.io/c/25KaBb/5431453649143450783?ty=x"},"commentCount":0,"interactionStatistic":[{"@type":"InteractionCounter","interactionType":"https://schema.org/ViewAction","userInteractionCount":1364}]}},{"@type":"ListItem","position":18,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/2467","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/2467","mainEntityOfPage":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/2467","headline":"🤔 Какие способы сортировки массива есть? В JavaScript массивы сортируются с помощью метода sort() Также можно…","articleBody":"🤔 Какие способы сортировки массива есть?\n\nВ JavaScript массивы сортируются с помощью метода sort()\nТакже можно использовать:\n- Сортировку по строкам (по умолчанию): arr.sort()\n- Сортировку по свойствам объектов:\n- users.sort((a, b) => a.age - b.age);\n- Создание новых отсортированных массивов без мутации:\n- const sorted = [...arr].sort();\n\nСтавь 👍 если знал ответ, 🔥 если нет\nЗабирай 📚 Базу знаний","datePublished":"2026-03-15T16:10:42Z","dateModified":"2026-03-15T16:10:42Z","author":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru","image":"https://img.telemetr.io/c/25KaBb/5431453649143450783?ty=x"},"publisher":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru","image":"https://img.telemetr.io/c/25KaBb/5431453649143450783?ty=x"},"commentCount":0,"interactionStatistic":[{"@type":"InteractionCounter","interactionType":"https://schema.org/ViewAction","userInteractionCount":1878},{"@type":"InteractionCounter","interactionType":"https://schema.org/LikeAction","userInteractionCount":10},{"@type":"InteractionCounter","interactionType":"https://schema.org/ShareAction","userInteractionCount":10}]}},{"@type":"ListItem","position":19,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/2466","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/2466","mainEntityOfPage":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/2466","headline":"🤔 Что такое merge и rebase, в чем отличие друг от друга? Это два способа интеграции изменений из одной ветки…","articleBody":"🤔 Что такое merge и rebase, в чем отличие друг от друга?\n\nЭто два способа интеграции изменений из одной ветки в другую в системе контроля версий Git. Оба метода имеют свои особенности и подходят для разных сценариев.\n\n🚩Merge (слияние)\n\nОбъединяет изменения из одной ветки в другую, создавая новый коммит слияния (merge commit). Этот метод сохраняет историю всех коммитов, включая все ветвления и слияния.\nПредположим, у вас есть две ветки: main и feature.\nВ ветке feature вы сделали несколько коммитов.\nВы хотите объединить изменения из feature в main.\ngit checkout main\ngit merge feature\n\n🚩Rebase (перебазирование) \n\nПеремещает или переписывает базу текущей ветки на указанную базу другой ветки. Это переписывает историю коммитов, создавая новые коммиты для каждого из оригинальных коммитов.\nПредположим, у вас есть две ветки: main и feature.\nВ ветке feature вы сделали несколько коммитов.\nВы хотите перенести изменения из feature на текущий конец main.\ngit checkout feature\ngit rebase main\n\n🚩Основные отличия\n\n🟠История коммитов\nMerge: Сохраняет всю историю, включая коммиты слияния. История показывает, когда и как происходили слияния веток.\nRebase: Переписывает историю, делая её линейной. История показывает, как если бы все изменения были сделаны последовательно, без ветвлений.\n\n🟠Коммиты слияния\nMerge: Создает новый коммит слияния, который объединяет изменения из двух веток.\nRebase: Не создает коммит слияния. Перебазирование \"переносит\" коммиты одной ветки на другую.\n\n🟠Конфликты\nMerge: Конфликты решаются один раз при слиянии.\nRebase: Конфликты могут возникнуть на каждом коммите, и их нужно решать поэтапно.\n\n🟠Применение\nMerge: Хорош для сохранения полного контекста истории разработки, особенно в командной работе.\nRebase: Хорош для поддержания чистой, линейной истории, особенно перед слиянием ветки в основную ветку, например, main или master.\n\nСтавь 👍 и забирай 📚 Базу знаний","datePublished":"2026-03-15T09:05:40Z","dateModified":"2026-03-15T09:05:40Z","author":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru","image":"https://img.telemetr.io/c/25KaBb/5431453649143450783?ty=x"},"publisher":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru","image":"https://img.telemetr.io/c/25KaBb/5431453649143450783?ty=x"},"commentCount":0,"interactionStatistic":[{"@type":"InteractionCounter","interactionType":"https://schema.org/ViewAction","userInteractionCount":2066},{"@type":"InteractionCounter","interactionType":"https://schema.org/LikeAction","userInteractionCount":8},{"@type":"InteractionCounter","interactionType":"https://schema.org/ShareAction","userInteractionCount":25}]}},{"@type":"ListItem","position":20,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/2465","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/2465","mainEntityOfPage":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru/posts/2465","headline":"🤔 Как работает поток данных между Redux и компонентом? Компонент получает данные из Redux через функции useSe…","articleBody":"🤔 Как работает поток данных между Redux и компонентом?\n\nКомпонент получает данные из Redux через функции useSelector или connect(). При изменении состояния Redux происходит перерисовка. Чтобы изменить состояние, компонент диспатчит action через dispatch.\n\nСтавь 👍 если знал ответ, 🔥 если нет\nЗабирай 📚 Базу знаний","datePublished":"2026-03-14T16:10:41Z","dateModified":"2026-03-14T16:10:41Z","author":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru","image":"https://img.telemetr.io/c/25KaBb/5431453649143450783?ty=x"},"publisher":{"@type":"Organization","name":"Frontend | Вопросы собесов","url":"https://telemetr.io/uz/channels/1917151177-easy_javascript_ru","image":"https://img.telemetr.io/c/25KaBb/5431453649143450783?ty=x"},"commentCount":0,"interactionStatistic":[{"@type":"InteractionCounter","interactionType":"https://schema.org/ViewAction","userInteractionCount":1942},{"@type":"InteractionCounter","interactionType":"https://schema.org/LikeAction","userInteractionCount":10},{"@type":"InteractionCounter","interactionType":"https://schema.org/ShareAction","userInteractionCount":7}]}}]}
Как заработать больше в 2026 году
Т-Инвестиции запускают онлайн-интенсив «ТОЛК», чтобы прокачать финансовую грамотность.
Эксперты научат:
— формировать пассивный доход;
— вкладываться в нужные бумаги;
— накопить на мечты и безбедную старость;
— профессионально зарабатывать на инвестициях.
Программа длится три недели. Вы получите практические кейсы и советы ведущих российских трейдеров.
Старт уже 1 апреля, успейте зарегистрироваться
Зарегистрироваться
#реклама 16+
t-tolk.ruО рекламодателе
🤔 Что известно про систему сборки проектов?
Система сборки отвечает за автоматизацию подготовки проекта к запуску, включая:
- компиляцию и минификацию;
- сборку модулей;
- транспиляцию кода (например, Babel);
- упаковку стилей и скриптов;
- копирование ассетов;
- запуск тестов.
Примеры: Webpack, Vite, Parcel, Rollup.
Ставь 👍 если знал ответ, 🔥 если нет
Забирай 📚 Базу знаний
🤔 Что такое webgl?
WebGL (Web Graphics Library) — это JavaScript API для рендеринга 2D и 3D-графики в браузере без необходимости установки дополнительных плагинов. Он основан на OpenGL ES и работает внутри HTML5-элемента <canvas>. WebGL позволяет использовать мощность графического процессора (GPU) для отрисовки сложных сцен, анимаций и интерактивных приложений прямо в браузере.
🚩Зачем нужен WebGL?
🟠Рендеринг 3D-графики в браузере
Без WebGL для создания сложных 3D-сцен в вебе приходилось использовать Flash, Java-апплеты или другие технологии. WebGL делает это нативно в браузере.
🟠Использование аппаратного ускорения
WebGL использует мощность видеокарты (GPU), а не только центрального процессора (CPU), что значительно ускоряет обработку графики.
🟠Работа в разных браузерах и на разных устройствах
WebGL работает на большинстве современных браузеров (Chrome, Firefox, Edge, Safari) и поддерживается на Windows, macOS, Linux, iOS и Android.
🟠Поддержка интерактивных приложений
Используется в играх, 3D-графике, симуляциях, картографических сервисах (например, Google Maps, Cesium.js), визуализациях данных.
🟠🚩ак использовать WebGL?
WebGL управляет графикой через шейдеры — небольшие программы, которые выполняются на видеокарте. Для работы с WebGL обычно используются библиотеки, упрощающие разработку, например:
- Three.js — высокоуровневая библиотека для удобной работы с WebGL.
- Babylon.js — мощный движок для создания 3D-приложений.
- PixiJS — библиотека для 2D-графики с поддержкой WebGL.
<canvas id="webgl-canvas"></canvas>
<script>
// Получаем WebGL-контекст
const canvas = document.getElementById("webgl-canvas");
const gl = canvas.getContext("webgl");
if (!gl) {
console.error("WebGL не поддерживается");
}
// Устанавливаем цвет фона и очищаем экран
gl.clearColor(0.0, 0.0, 0.0, 1.0); // Черный фон
gl.clear(gl.COLOR_BUFFER_BIT);
</script>
🤔 Как организовать код (Module Pattern, наследование)?
- Module Pattern: используется для инкапсуляции кода, скрытия деталей реализации и создания чистых API. Обычно основан на IIFE и возвращает объект с публичными методами.
- Наследование: в JS можно использовать прототипное наследование (через Object.create или классы), чтобы передавать поведение от одного объекта к другому. Это упрощает переиспользование кода.
Ставь 👍 если знал ответ, 🔥 если нет
Забирай 📚 Базу знаний
🤔 Как достигается изоляция при использовании бэм?
БЭМ (Блок, Элемент, Модификатор) достигает изоляции стилей с помощью уникальных имен классов. Это помогает избежать конфликтов между стилями и делает код более предсказуемым.
🚩Как БЭМ предотвращает конфликты?
🟠Все стили зависят только от конкретного блока
В БЭМ нет зависимостей от родительских элементов, поэтому стили блока не сломаются, если он окажется в другом месте.
<div class="button">Кнопка</div>
.button {
background: blue;
color: white;
}
Плохой пример без БЭМ
.container .button {
background: blue;
}
🟠Элементы (`__`) зависят только от своего блока
Стили элемента никогда не зависят от родителя — только от блока.
Битва кейсов ИБ: 6 сценариев киберкошмара
7 апреля в поединке сойдутся эксперты «Солара».
По одну сторону — кейсы тестирований на проникновение, по другую — реальные атаки.
Чьи сценарии окажутся страшнее и критичнее — покажет битва.
Кому будет полезно:
Руководителям ИБ и ИБ-специалистам — получить данные, чтобы обосновать бюджет и построить стратегию защиты.
ИТ-руководителям и менеджерам — узнать о текущих рисках и понять, как спланировать ИБ-бюджет.
Руководителям компаний и риск-менеджерам — снизить цифровые и финансовые риски, защитить репутацию.
Приходите, чтобы на чужих ошибках закрыть пробелы в своей защите.
Зарегистрироваться
#реклама 16+
rt-solar.ruО рекламодателе
🤔 Как принудительно обновить компонент во Vue?
Иногда Vue может не понять, что данные изменились. В таком случае можно заставить компонент перерисоваться. Один способ — изменить значение key у компонента, это заставит его перерисоваться заново. Также можно использовать локальное реактивное состояние, которое сбрасывается и снова включает компонент. В крайнем случае используют forceUpdate, но это плохая практика.
Ставь 👍 если знал ответ, 🔥 если нет
Забирай 📚 Базу знаний
🤔 Зачем нужен eslint?
ESLint – это инструмент для автоматического анализа и исправления кода в JavaScript и TypeScript. Он помогает разработчикам следовать единым стилям кодирования, находить ошибки и предотвращать баги ещё до запуска кода.
🚩Почему ESLint полезен?
Без линтера код может быть неаккуратным и содержать ошибки, которые сложно отловить.
🚩Проблемы без ESLint
Разные стили написания кода
Пропущенные точки с запятой или лишние пробелы
Неиспользуемые переменные
Ошибки, которые не выявляются во время компиляции (например, undefined переменные)
🚩Решение с ESLint:
Автоматически находит ошибки и предупреждения
Подсказывает лучшие практики
Поддерживает кастомные правила
Работает в IDE и CI/CD (автоматическая проверка)
🟠Как ESLint работает?
ESLint использует набор правил, которые проверяют код. Если код нарушает эти правила – линтер выдаёт предупреждение или ошибку.
function sayHello(name) {
console.log("Hello, " + name)
}
sayHello("John")
Пример исправленного кода (ESLint fix)
function sayHello(name) {
console.log(`Hello, ${name}`);
}
sayHello("John");
🟠Как установить и настроить ESLint?
Установка
npm install eslint --save-dev
Создание конфига
npx eslint --init
Пример .eslintrc.js (настройки ESLint)
module.exports = {
env: {
browser: true,
es6: true,
},
extends: [
"eslint:recommended", // Базовые рекомендации
"plugin:vue/vue3-recommended" // Рекомендации для Vue
],
rules: {
"no-unused-vars": "warn", // Предупреждать о неиспользуемых переменных
"semi": ["error", "always"], // Обязательные точки с запятой
"quotes": ["error", "double"], // Только двойные кавычки
},
};
Запуск проверки кода
npx eslint myfile.js
Автоматическое исправление ошибок
npx eslint myfile.js --fix
🟠ESLint в IDE (VS Code, WebStorm)
Чтобы ESLint работал в VS Code, установите расширение ESLint и включите "editor.codeActionsOnSave"
🟠ESLint в CI/CD (автоматическая проверка на сервере)
В проектах ESLint можно запускать в GitHub Actions, Jenkins, GitLab CI и других CI/CD системах, чтобы не допускать ошибок в main ветку.
🤔 Какие есть способы модификации цвета?
Можно изменить прозрачность, использовать фильтры, градиенты, наложения и тени. Также можно программно управлять цветом, меняя его тон, насыщенность, яркость через функции препроцессоров или CSS-функции.
Ставь 👍 если знал ответ, 🔥 если нет
Забирай 📚 Базу знаний
🤔 Зачем нам разбивать приложение отдельно на backend и frontend?
Разделение на Frontend (клиент) и Backend (сервер) – это стандартный подход в современной веб-разработке. Это делает приложение гибче, масштабируемее и удобнее в разработке.
🚩Почему лучше разделять?
🟠Гибкость и масштабируемость
Можно менять Frontend и Backend независимо.
Можно использовать разные технологии (например, Vue.js + Django).
Можно легко разделить команды разработчиков.
🟠Повышенная безопасность
Frontend не имеет доступа к базе данных.
Все важные вычисления, авторизация, хранение данных происходят на сервере.
API можно защитить токенами (JWT, OAuth).
🟠Уменьшение нагрузки на клиент
Логика обработки данных выполняется на сервере.
Клиент получает уже готовые данные, а не загружает огромные файлы.
🟠Легче разрабатывать и тестировать
Можно разрабатывать Frontend и Backend независимо.
Можно подменять сервер на mock-данные во время разработки.
🚩Как они общаются? (REST API & GraphQL)
Разделённые приложения общаются через API:
REST API (GET, POST, PUT, DELETE)
GraphQL API (запросы только нужных данных)
WebSockets (реальное время, чаты, онлайн-игры)
Нейросеть проверит 100% закупок на стройке за минуты!
👍Контроль закупок за 15 минут в день. Нейросеть "Тринити" экономит ваше время и миллионы рублей
Вы - генеральный директор строительной компании, и у вас катастрофически не хватает времени? Работаете 12+ часов в день и не можете контролировать каждую закупку?
💰Тратите миллионы на закупки, но не уверены, что получаете лучшие цены и качество? Хотите спать спокойно, зная, что ваши деньги под защитой?
Просто загрузите счет или тендерный протокол в Telegram-бот
Получите детальный анализ по 18 параметрам за 1 минуту
Экономьте до 10% на каждой закупке без дополнительных усилий
В 3-5 раз дешевле, чем содержать штат контролеров! Работает 24/7 без выходных и отпусков.
👌Узнайте про наш телеграм-бот и тестируйте бесплатно 7 дней! Экономия в первый же день.
Перейти на сайт
#реклама 16+
trinitysafe.ruО рекламодателе
🤔 Как заредиректить пользователя на URL?
Можно изменить свойство, отвечающее за текущий адрес страницы, или вызвать метод, который вызывает загрузку другого URL. Это работает как обычный переход по ссылке.
Ставь 👍 если знал ответ, 🔥 если нет
Забирай 📚 Базу знаний
🤔 Что такое шаблонные литералы, и для чего они нужны?
Были введены в ECMAScript 2015 (ES6) и представляют собой улучшение стандартных строк в JavaScript. Они облегчают работу с строками, предоставляя более удобный синтаксис для создания многострочных строк, интерполяции переменных и встроенных выражений.
🚩Примеры использования
🟠Интерполяция переменных и выражений
Шаблонные литералы позволяют встраивать переменные и выражения внутрь строк с помощью синтаксиса ${}.
const name = 'Alice';
const age = 25;
const greeting = `Hello, my name is ${name} and I am ${age} years old.`;
console.log(greeting);
// Вывод: Hello, my name is Alice and I am 25 years old.
🟠Многострочные строки
Шаблонные литералы позволяют создавать многострочные строки без необходимости использования символов переноса строки (\n).
const multiLineString = `This is a string
that spans across
multiple lines.`;
console.log(multiLineString);
// Вывод:
// This is a string
// that spans across
// multiple lines.
🟠Встроенные выражения
Внутри шаблонных литералов можно использовать любые JavaScript-выражения.
const a = 5;
const b = 10;
const result = `The sum of ${a} and ${b} is ${a + b}.`;
console.log(result);
// Вывод: The sum of 5 and 10 is 15.
🟠Вызов функций внутри шаблонных литералов
Можно вызывать функции и методы внутри шаблонных литералов.
function toUpperCase(str) {
return str.toUpperCase();
}
const name = 'Alice';
const loudGreeting = `Hello, ${toUpperCase(name)}!`;
console.log(loudGreeting);
// Вывод: Hello, ALICE!
🟠Тегированные шаблонные литералы
Тегированные шаблонные литералы позволяют обработать строку с помощью функции перед ее окончательной интерпретацией.
🤔 Что такое псевдоэлемент?Псевдоэлемент — это CSS-конструкция, которая позволяет стилизовать определённые части элемента, например, ::before для добавления контента перед элементом или ::after для добавления после. Это удобно для оформления, не изменяя HTML-структуру.
Ставь 👍 если знал ответ, 🔥 если нет
Забирай 📚 Базу знаний
🤔 Как считается вес селектора?
Вес селектора (специфичность) – это правило, по которому браузер определяет, какой стиль применить, если есть несколько конфликтующих селекторов.
🟠Как повысить вес селектора?
Добавить ID (но не злоупотреблять). Использовать более специфичные селекторы (например, .header h1 вместо h1). Использовать !important (но осторожно!).
h1 { color: red !important; } /* Всегда будет красным */
Бесплатная конференция по PostgreSQL — уже 19 марта!
Регистрируйся на бесплатную конференцию по PostgreSQL — 19.03.2026.
В фокусе — практический опыт эксплуатации PostgreSQL, ее внутреннее устройство, производительность, взаимодействие с другими системами и реальные кейсы из highload-среды.
Мероприятие в формате онлайн+офлайн, 25+ тематических докладов, 3 потока.
Вот некоторые темы конференции:
✅ Опыт выноса OLAP-нагрузки на реплику
✅ Временные таблицы в PostgreSQL: почему это критично для платформы 1С и что можно улучшить
✅ Разделение Compute и Storage: архитектурный прорыв для PostgreSQL в облаке
✅ Highload «из ниоткуда»: когда узкое место — не в СУБД, а в клиентской архитектуре
✅ Работа с логами PostgreSQL
Регистрируйся, будет интересно!
И бесплатно!Зарегистрироваться
#реклама 16+
pgbootcamp.ruО рекламодателе
🤔 Какие способы сортировки массива есть?
В JavaScript массивы сортируются с помощью метода sort()
Также можно использовать:
- Сортировку по строкам (по умолчанию): arr.sort()
- Сортировку по свойствам объектов:
- users.sort((a, b) => a.age - b.age);
- Создание новых отсортированных массивов без мутации:
- const sorted = [...arr].sort();
Ставь 👍 если знал ответ, 🔥 если нет
Забирай 📚 Базу знаний
🤔Что такое merge и rebase, в чем отличие друг от друга?
Это два способа интеграции изменений из одной ветки в другую в системе контроля версий Git. Оба метода имеют свои особенности и подходят для разных сценариев.
🚩Merge (слияние)
Объединяет изменения из одной ветки в другую, создавая новый коммит слияния (merge commit). Этот метод сохраняет историю всех коммитов, включая все ветвления и слияния.
Предположим, у вас есть две ветки: main и feature.
В ветке feature вы сделали несколько коммитов.
Вы хотите объединить изменения из feature в main.
git checkout main
git merge feature
🚩Rebase (перебазирование)
Перемещает или переписывает базу текущей ветки на указанную базу другой ветки. Это переписывает историю коммитов, создавая новые коммиты для каждого из оригинальных коммитов.
Предположим, у вас есть две ветки: main и feature.
В ветке feature вы сделали несколько коммитов.
Вы хотите перенести изменения из feature на текущий конец main.
git checkout feature
git rebase main
🚩Основные отличия
🟠История коммитов
Merge: Сохраняет всю историю, включая коммиты слияния. История показывает, когда и как происходили слияния веток.
Rebase: Переписывает историю, делая её линейной. История показывает, как если бы все изменения были сделаны последовательно, без ветвлений.
🟠Коммиты слияния
Merge: Создает новый коммит слияния, который объединяет изменения из двух веток.
Rebase: Не создает коммит слияния. Перебазирование "переносит" коммиты одной ветки на другую.
🟠Конфликты
Merge: Конфликты решаются один раз при слиянии.
Rebase: Конфликты могут возникнуть на каждом коммите, и их нужно решать поэтапно.
🟠Применение
Merge: Хорош для сохранения полного контекста истории разработки, особенно в командной работе.
Rebase: Хорош для поддержания чистой, линейной истории, особенно перед слиянием ветки в основную ветку, например, main или master.
Ставь 👍 и забирай 📚 Базу знаний
🤔 Как работает поток данных между Redux и компонентом?
Компонент получает данные из Redux через функции useSelector или connect(). При изменении состояния Redux происходит перерисовка. Чтобы изменить состояние, компонент диспатчит action через dispatch.
Ставь 👍 если знал ответ, 🔥 если нет
Забирай 📚 Базу знаний