и посмотреть медиа
Frontend Interview - JS HTML CSS
и посмотреть медиа
Канал для подготовки к собеседованиям по фронтенду: JavaScript, HTML, CSS. Практические задания и разборы.
Канал для подготовки к собеседованиям по фронтенду: JavaScript, HTML, CSS. Практические задания и разборы.
Ресурс посвящен подготовке к собеседованиям на позиции фронтенд-разработчика. Содержит вопросы, тесты и ответы по JavaScript, HTML и CSS. Помогает систематизировать знания и уверенно пройти интервью.
Опасности использования innerHTML в JavaScript innerHTML – это свойство, которое позволяет вставлять HTML-код внутрь элемента как строку. Однако оно небезопасно и может привести к серьезным проблемам. document.getElementById("content").innerHTML = "Привет! "; Уязвимость: XSS-атаки (внедрение вредоносного кода) Если innerHTML получает данные от пользователя (например, из формы или URL), хакер может вставить вредоносный JavaScript-код. const userInput = "alert('Вас взломали!');"; document.getElementById("content").innerHTML = userInput; Проблемы с безопасностью CSP (Content Security Policy) Если в веб-приложении включена CSP (защита от XSS), то innerHTML может нарушать политику безопасности. Случайное удаление обработчиков событий Если заменить содержимое элемента через innerHTML, все обработчики событий внутри него удалятся. document.getElementById("btn").addEventListener("click", () => { alert("Нажато!"); }); document.getElementById("container").innerHTML = "Клик"; document.getElementById("btn").click(); // Ошибка, обработчик удален 👉 @frontendInterview
Открыть канал и посмотреть медиаSpin Around, Touch the Ground Вам дан массив, состоящий из строк "left" и "right". Каждая строка делает поворот на 90° в соответствующую сторону. Создайте функцию, которая вернет количество разворотов на 360°. Примеры: ["left", "right", "left", "right"] ➞ 0 ["right", "right", "right", "right", "right", "right", "right", "right"] ➞ 2 ["left", "left", "left", "left"] ➞ 1 👉 @frontendInterview
Открыть канал и посмотреть медиа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
Открыть канал и посмотреть медиаОбъект пользовательского события 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
Открыть канал и посмотреть медиаРасскажи про области видимости В 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
Открыть канал и посмотреть медиаOnly registered users can share their opinion.
Be the first to share your impression of this resource!
CanalMedCannILwith updates on medical cannabis. Israel News, Research and Regulation.
Channel of eventsMetin2.Italia: Reminders 15 minutes before launch via server Italy. Current calendar.