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

Real-World Next.js: Build scalable, high-performance, and modern web applications using Next.js, the React framework for production Next.js - это масштабируемый и высокопроизводительный фреймворк поверх React.js для современной веб-разработки, предоставляющий большой набор функций, таких как гибридный рендеринг, предварительная выборка маршрутов, автоматическая оптимизация изображений и интернационализация. Если вы хотите создать блог, сайт электронной коммерции или простой веб-сайт, эта книга покажет вам, как можно использовать многоцелевой фреймворк Next.js для создания впечатляющего пользовательского опыта. 👉 @frontendInterview

REKONFA Live 6 ноября приглашаем всех, кто имеет отношение к маркетингу и рекламным технологиям, обсудить рынок, тренды, вызовы и их решения. С докладами на актуальные темы выступят лидеры индустрии и медийные спикеры. Принять участие можно офлайн и онлайн. Мероприятие бесплатное, нужно только зарегистрироваться. Зарегистрироваться #реклама 18+ ya.rekonfa.ru О рекламодателе

​Объект пользовательского события CustomEvent CustomEvent даёт возможность создавать пользовательские события с произвольным именем и дополнительной информацией. Их можно запускать вручную и отслеживать через стандартные механизмы событий. Пример

const myCustomEvent = new CustomEvent('mycustomevent', {
  detail: {
    key: 'value'
  }
})

CustomEvent создаёт пользовательское (кастомное) событие. Оно даёт разработчику возможность самостоятельно определить, когда событие происходит, как называется и какие данные с ним передаются. Пригодится, когда стандартных DOM-событий (например, click или input) недостаточно для описания происходящего на странице. CustomEvent похож на обычный Event. Основное отличие — CustomEvent позволяет передать дополнительные данные, а Event нет. Отправить пользовательское событие можно с помощью dispatchEvent(). 👉 @frontendInterview

"Да, я развился в такой перспективной сфере как гуглить" 👉 @frontendInterview

HTML- и CSS-советы для джуниор фронтенд-разработчиков Я начинал изучать вёрстку в 2010 году. Я не знал английский, поэтому у меня был ограниченный набор материала. Кто помнит видеоуроки Попова? Хорошо, что сейчас ситуация уже лучше. В целом можно найти очень классные статьи, видео и бесплатные курсы. Но и мне есть что сказать! Я собрал несколько советов. По моей задумке, если вы обратите внимание на эти аспекты, то ваш код будет лучше. Давайте посмотрим, что я вам подготовил. 👉 @frontendInterview

Вставка изображений в HTML Картинки — важная часть веба. Они делают сайты визуально выразительными, помогают передать смысл, иллюстрируют текст и даже играют функциональную роль (например, иконки или изображения товаров). И у HTML есть сразу несколько способов вставки изображений. 👉 @frontendInterview

Google Meet перестал работать в России: что дальше? 📞🏃‍♂️ Сперва в Telegram и WhatsApp заблокировали звонки, а теперь и Google Meet сбоит. Видеозвонки не проходят ни с телефонов, ни с ПК. Для бизнеса это означает: - сорванные онлайн-совещания и встречи с клиентами; - срыв собеседований и переговоров с подрядчиками; - потерю времени и простои в коммуникациях команд; - срочный поиск альтернативы для видеозвонков и онлайн-летучек. Что делать бизнесу, когда зарубежные сервисы один за другим перестают работать в России? ✅ В МТС Линк: видеозвонки, чаты, онлайн-доски и совещания без сбоев и ограничений 40 минут; дата-центры в России, соответствие 152-ФЗ и 149-ФЗ; готовые интеграции; русскоязычная техподдержка 24/7. Проверьте, подходит ли МТС Линк вашей компании Узнать больше #реклама 16+ mts-link.ru О рекламодателе

👉 @frontendInterview

​Расскажи про области видимости В JavaScript область видимости (scope) определяет доступность переменных, функций и объектов в разных частях кода. Это фундаментальная концепция, которая управляет тем, какие данные могут быть доступны или недоступны в различных частях программы. Глобальная область видимости Переменные и функции, объявленные вне любых функций или блоков, находятся в глобальной области видимости. Они доступны из любой части программы.

var globalVar = 'Я глобальная переменная';

function testFunction() {
  console.log(globalVar); // Доступно
}

testFunction();
console.log(globalVar); // Доступно

Функциональная область видимости Переменные, объявленные с помощью var внутри функции, имеют область видимости, ограниченную этой функцией. Они недоступны за её пределами.

function testFunction() {
  var functionVar = 'Я внутри функции';
  console.log(functionVar); // Доступно
}

testFunction();
console.log(functionVar); // Ошибка: переменная functionVar недоступна

Блочная область видимости Переменные, объявленные с помощью let и const, имеют область видимости, ограниченную ближайшим блоком {}.

if (true) {
  let blockVar = 'Я внутри блока';
  console.log(blockVar); // Доступно
}

console.log(blockVar); // Ошибка: переменная blockVar недоступна

Область видимости модуля (Module Scope) При использовании модулей (например, import и export в ES6), все переменные и функции в модуле имеют собственную область видимости. Они не попадают в глобальную область видимости.

export const myVar = 'Я переменная из модуля';

import { myVar } from './module1.js';
console.log(myVar); // "Я переменная из модуля"

👉 @frontendInterview

🚀 AI Интервью — умная программа для помощи на собеседованиях в Телемост, Google Meet, Zoom, Teams и на других платформах! 💎 Слушает, что говорит интервьюер 💎 Подсказывает правильные ответы в реальном времени, прямо во время разговора 💎 Интервьюер не видит окно с подсказками Программа очень хорошо работает для собеседований на вакансии разработчика, архитектора, CTO и других. На любых языках. Подпишитесь на канал AI Интервью и используйте программу на ближайшем собеседовании.

Counting Change Combinations Напишите функцию, которая подсчитывает, сколькими различными способами вы можете разменять определенную сумму денег, учитывая массив номиналов монет. Например, есть 3 способа сдачи на 4, если у вас есть монеты номиналом 1 и 2:

1+1+1+1, 1+1+2, 2+2.

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

1+1+2 == 2+1+1

Также предположим, что у вас бесконечное количество монет. Ваша функция должна принимать сумму для изменения и массив уникальных номиналов монет Пример:

countChange(4, [1,2]) // => 3
countChange(10, [5,2,3]) // => 4
countChange(11, [5,7]) //  => 0

👉 @frontendInterview

Грокаем функциональное программирование Вам кажется, что функциональное программирование – это нечто сложное, доступное только гуру программирования? Эта книга развенчает миф об элитарности и позволит любому программисту с легкостью разобраться в хитросплетениях кода. От знакомых и простых идей ООП вы перейдете к ФП, рассматривая его на простых примерах, захватывающих упражнениях и большом количестве иллюстраций. Вы начнете с решения простых и маленьких задач, иллюстрирующих базовые понятия, такие как чистые функции и неизменяемые данные, научитесь писать код, лишенный типичных ошибок, обусловленных наличием сложного распределенного состояния, разберетесь с подходами к реализации ввода-вывода, параллельного выполнения и потоковой передачи данных. К концу книги вы будете создавать ясный функциональный код, который легко читается, тестируется и сопровождается. 👉 @frontendInterview

Ищу желающих выполнять задачи с помощью ИИ! Работа полностью на удаленке с зп до 150 000 рублей в месяц. Без опыта, нужен только телефон, занятость 3-6 часов в день. Всему обучат на бесплатном курсе и после возьму на работу: ✅ 3 дня уроков по 30 минут ✅ Домашки с проверкой и оплатой бонусами ✅ Плачу 10 тыс за каждую выполненную домашку Все кто пройдет курс, получат сертификат от школы с образовательной лицензией. ⚡ Набор заканчивается завтра. 👍 Для регистрации жмите кнопку "Зарегистрироваться": Зарегистрироваться #реклама 16+ ganstaagency.com О рекламодателе

Как вы производите отладку кода? Отладка JS кода — это процесс поиска и исправления ошибок, которые возникают в программном обеспечении. Этот процесс важен для выявления логических ошибок, неправильных значений переменных и других проблем, которые могут возникнуть во время разработки. Рассмотрим основные инструменты и методы для отладки JavaScript кода. Основные инструменты Консоль разработчика в браузере Все современные браузеры (Chrome, Firefox, Edge, Safari) имеют встроенные инструменты для разработчиков, которые включают консоль для вывода сообщений, просмотра значений переменных и выполнения JavaScript кода в реальном времени. Пример использования консоли в Chrome: 1. Откройте инструменты разработчика (F12 или Ctrl+Shift+I). 2. Перейдите на вкладку "Console". 3. Используйте console.log(), console.error(), console.warn() для вывода сообщений в консоль.

console.log('Это сообщение для отладки');
console.error('Это сообщение об ошибке');
console.warn('Это предупреждающее сообщение');   

Точки останова (breakpoints) Точки останова позволяют приостановить выполнение кода на определенной строке, чтобы можно было исследовать текущее состояние программы (значения переменных, выполнение функций и т.д.). Пример использования точек останова в Chrome: 1. Откройте инструменты разработчика и перейдите на вкладку "Sources". 2. Найдите и откройте файл JavaScript. 3. Щелкните на номер строки, где хотите установить точку останова. 4. Обновите страницу и выполнение остановится на установленной точке останова. Интерактивное выполнение кода Инструменты разработчика позволяют выполнять JavaScript код в реальном времени через консоль. Пример: 1. Откройте инструменты разработчика и перейдите на вкладку "Console". 2. Введите и выполните произвольный JavaScript код, например:

let x = 10;
let y = 20;
console.log(x + y); // 30

Просмотр вызовов функций (Call Stack) Инструменты разработчика позволяют отслеживать вызовы функций и видеть, как они были вызваны друг другом. Пример: Когда выполнение приостановлено на точке останова, откройте вкладку "Call Stack" в инструментах разработчика, чтобы увидеть последовательность вызовов функций. 👉 @frontendInterview

Дедлайн просто подгоняет 👉 @frontendInterview

Огромный набор практики для frontend-разработчика Подборка материалов с @devjora для собеседований и прокачки навыков по JS, React, алгосам и Vue Сборник задач со 100+ собеседований за последний год в виде полноценных гайдов и сборнииков 👩‍💻 Топ 200 вопросов по React 📕 Гайд по алгоритмам для frontend 📚 Promise, async/await, асинхронность: задачи и вопросы с собеседований 👩‍💻 Топ вопросов по Vue 👩‍💻 Задачи на React рефакторинг 📅 React-календарь с практикой на каждый день