Made in HTML/CSS
1.52K subscribers
716 photos
35 videos
2 files
637 links
Научись классно верстать и создавать сайты благодаря Made in HTML/CSS.
По рекламе - https://t.me/ZilantTG
Download Telegram
Что такое indexOf?

Метод indexOf() в JavaScript — это встроенная функция, которая ищет указанный элемент в массиве или строке и возвращает его индекс. Если значение не найдено, метод возвращает -1.
Некоторые ограничения метода indexOf():
- Регистрозависимость. Метод ищет точное соответствие указанной строке, включая регистр.
- Обработка NaN. Если в массиве или строке ищется NaN, метод вернёт -1.
- Пустая строка или массив — метод также вернёт -1


Made in HTML/CSS
👨‍💻4🔥2👍1
Object.freeze предотвращает модификацию объекта, защищая его от изменений.

Made in HTML/CSS
🔥7
Как тестируют фронтенд?

Тестирование является неотъемлемой частью разработки сайта, так как оно обеспечивает выявление и исправление ошибок на ранних этапах, что значительно повышает качество конечного продукта. Оно помогает убедиться, что все компоненты сайта работают корректно и взаимодействуют друг с другом без сбоев.

Как именно происходит тестирование и какие компоненты используется для этого процесса рассмотрены

🌐 Читать статью

Made in HTML/CSS
🔥4👍3
ИИ-инструменты замедляют опытных разработчиков: результаты исследования METR

Исследование METR показало, что опытные разработчики работают на 19% медленнее с ИИ-инструментами, хотя сами считают, что ускорились на 20%.

Интересная статья, демонстрирующая влияние нейросетевых инструментов на работу разработчиков со ссылкой на статистику

🌐 Читать статью

Made in HTML/CSS
🔥7
Шаблонные литералы (или шаблонные строки) в JavaScript предоставляют удобный способ создания строк, которые могут содержать встроенные выражения.

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


Made in HTML/CSS
👍7
LambdaTest — это полноценная облачная платформа для тестирования веб-приложений и сайтов. Она предоставляет разработчикам и тестировщикам возможность проводить кросс-браузерное тестирование, автоматизированное тестирование и отладку веб-приложений на различных устройствах, браузерах и операционных системах.

Made in HTML/CSS
👍4🔥1
Remote - SSH — это расширение для популярного редактора кода Visual Studio Code (VS Code) , которое позволяет разработчикам подключаться к удаленным серверам через протокол SSH и работать с файлами и проектами, расположенными на этих серверах, как если бы они находились локально.

Made in HTML/CSS
👍3🔥2
Object.fromEntries упрощает создание объектов из массивов пар ключ-значение.


Made in HTML/CSS
🔥6
Jest Runner — это расширение для VS Code, которое упрощает работу с фреймворком для тестирования JavaScript-приложений Jest . Jest активно используется в экосистеме JavaScript/TypeScript для модульного тестирования (unit testing), интеграционного тестирования и других видов проверок кода.

Made in HTML/CSS
🔥4👍1
Что такое Coercion в JS?

Coercion
(приведение типов) в JavaScript — это автоматическое или явное преобразование значения из одного типа в другой.

JavaScript — язык со слабой типизацией, поэтому он часто пытается "угадать" нужный тип и преобразует значения неявно. Это может приводить к неожиданным результатам, если не понимать, как это работает.

Виды приведения типов
Явное (Explicit Coercion) – программист сам указывает преобразование.
Неявное (Implicit Coercion) – JavaScript делает это автоматически в определённых операциях.


Made in HTML/CSS
🔥6
Что такое политика безопасности контента?

Политика безопасности контента (Content Security Policy, CSP) — это мощный механизм защиты веб-приложений от различных атак, связанных с внедрением вредоносного кода. Разработанный консорциумом W3C в рамках стандартов веб-безопасности, CSP позволяет разработчикам контролировать, какие ресурсы (скрипты, стили, изображения и т. д.) могут загружаться и выполняться на их странице.
Основные угрозы, от которых защищает CSP

Межсайтовый скриптинг (XSS)
Блокирует выполнение вредоносных JavaScript-кодов, внедрённых через уязвимости.

Кликджекинг (Clickjacking)
Запрещает встраивание страницы во фреймы без явного разрешения.

Внедрение данных (Data Injection)
Предотвращает загрузку сторонних ресурсов (например, скриптов или стилей) с подозрительных доменов.

Атаки через динамический код (eval, inline-скрипты)
Ограничивает использование опасных функций, таких как eval(), setTimeout() со строками и встроенных (inline) скриптов.


Made in HTML/CSS
🔥6
Что такое свойство Z-индекса CSS?

Свойство z-index управляет позиционированием элементов вдоль оси Z (глубина), то есть может перемещать их ближе или дальше от экрана. Оно определяет порядок наложения элементов, которые перекрывают друг друга.

Синтаксис
z-index: auto | <целое число> | initial | inherit;
Значения:
auto (по умолчанию) — элемент располагается в порядке, указанном в DOM.

<целое число> — положительное или отрицательное число. Элементы с большим значением отображаются поверх элементов с меньшим.

initial — устанавливает значение по умолчанию (auto).

inherit — наследует значение от родительского элемента.


Made in HTML/CSS
👍3🔥3
Что такое npm?

NPM (Node Package Manager) — менеджер пакетов для программной платформы Node.js.
Он нужен, чтобы не писать весь код проекта с нуля, а использовать уже готовые решения. Библиотеки, фреймворки, утилиты — всё это называется «пакетами», и NPM помогает ими управлять


Made in HTML/CSS
👍6
Что такое Mixin в CSS?

Mixin (миксин, примесь) — это многократно используемый блок CSS-кода, который можно применять к разным элементам с помощью директивы @include.
Это помогает:
- Группировать стили и повторно использовать их в нескольких местах кода или в разных CSS-файлах.
- Инкапсулировать связанные стили в модульные блоки, что поощряет модульный подход к разработке CSS.
- Персонализировать миксин с помощью аргументов, что позволяет изменять его поведение (например, изменять цвета, размеры).

Миксины поддерживаются препроцессорами CSS, например Sass и SCSS.

Made in HTML/CSS
🔥9
Pretty TypeScript Errors — расширение для Visual Studio Code, которое улучшает отображение ошибок и предупреждений TypeScript.
Цель расширения — преобразовать стандартное форматирование ошибок TypeScript в более понятный и читаемый вид, что помогает разработчикам быстрее понимать и исправлять проблемы в своём коде.


Made in HTML/CSS
🔥3👍2
CSS Variable Autocomplete – полезное расширение для работы с CSS-переменными
Если вы активно используете CSS-переменные (Custom Properties) в своих проектах, то CSS Variable Autocomplete – это удобный инструмент, который ускоряет разработку, предлагая автодополнение и навигацию по переменным.

Made in HTML/CSS
🔥7
This media is not supported in your browser
VIEW IN TELEGRAM
Git Graph — это мощное расширение для VS Code, которое превращает ваш встроенный Git-клиент в интерактивный граф коммитов с удобной визуализацией веток, тегов и слияний. Оно заменяет команду git log --graph и делает работу с историей репозитория намного удобнее.

Made in HTML/CSS
🔥6
Image Preview – это удобное расширение для VS Code, которое позволяет просматривать миниатюры изображений прямо в редакторе кода, не открывая их во внешних программах. Особенно полезно при работе с проектами, содержащими множество графических файлов (веб-разработка, документация, игры и т. д.).

Made in HTML/CSS
🔥4👨‍💻1
Чем полезно свойство clearfix в CSS?

Свойство clearfix
в CSS полезно для устранения проблемы с обтеканием блоков в веб-дизайне.
Когда используются плавающие элементы (с помощью свойства float), родительский контейнер может не расширяться по высоте, чтобы охватить эти элементы. Это происходит потому, что плавающие элементы выводятся из обычного потока документа. Вследствие этого могут возникать серьёзные проблемы с компоновкой.
Использование clearfix позволяет:
- Избежать проблем с компоновкой. Родительский элемент будет корректно окружать float-элементы, сохраняя при этом свою высоту.
- Удержать макет на месте. Clearfix предотвращает перемешивание с другими элементами, которые обтекаются.


Made in HTML/CSS
🔥5
Для чего используется ключевое слово «new»?

Ключевое слово «new» в JavaScript используется для создания экземпляров объектов на основе функций-конструкторов. Оно автоматически создаёт пустой объект, привязывает его к this внутри конструктора и возвращает созданный объект.

Это удобно, когда нужно создать множество однотипных объектов с разными свойствами. Например, для игры можно сделать конструктор врагов и потом создавать новых противников в нужных местах.
Особенности работы:
- Внутреннее свойство prototype нового объекта (proto) становится таким же, как и у конструирующей функции.
- Переменная this указывает на вновь созданный объект, свойство, объявленное с ключевым словом this, привязано к новому объекту.
- Созданный объект возвращается, когда функция-конструктор возвращает не примитивное значение (т. е. объект JavaScript). Если функция-конструктор возвращает примитивное значение, оно будет проигнорировано.


Made in HTML/CSS
🔥3