DevGang
Авторизоваться

Варианты стилизации веб-компонентов 

Когда я выпустил emoji-picker-element в прошлом году, я впервые написал универсальный веб-компонент, который можно было добавить в любой проект или фреймворк. Кроме того, это был мой первый раз, когда я действительно использовал shadow DOM.

Доступные для записи геттеры

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

Использование Puppeteer для автоматического тестирования пользовательского интерфейса 

В эту эпоху передовых технологий написание скриптов для парсинга, тестирования и мониторинга может быть сложной задачей. Вот почему команда Google Chrome предоставила инструмент, который позволяет вам выполнять стандартные действия в браузере Chromium или Chrome программно через JavaScript с помощью простого и удобного API под названием Puppeteer.

В этой статье в блоге вы узнаете о Puppeteer и о том, как его использовать для очистки веб-страницы и записи автоматических тестов пользовательского интерфейса для вашего проекта.

Комментирование кода в JavaScript - типы и передовые методы 

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

Вы когда-нибудь возвращались к проекту и испытывали трудности с пониманием внутренней логики? Вероятно, это потому, что указанный проект не был прокомментирован должным образом.

Комментарии - это заметки, написанные в коде, которые игнорируются движком JavaScript, что означает, что они никоим образом не влияют на вывод. Их единственная цель - описать, как и почему код работает, другим разработчикам и вам самим.

В этой статье мы рассмотрим, как комментировать код JavaScript, какие типы комментариев существуют, а также некоторые передовые практики.

React setState: правильный путь 

В этом руководстве я объясню, как изменить состояние в компонентах React с помощью встроенного метода setState. Я подробно расскажу о двух разных подходах к использованию этого метода, объясню различия между этими подходами и покажу, когда использовать какой. В конце я расскажу о типичных ошибках, которые могут возникнуть при изменении состояния.

JavaScript, как найти дубликаты в массиве 

Если вы хотите удалить дубликаты, есть очень простой способ, используя структуру данных Set, предоставляемую JavaScript.

Проверка данных формы в Node.js с помощью Validator.js 

Практически каждый веб-сайт включает сбор пользовательского ввода с помощью HTML-форм. Каждый раз, когда мы собираем пользовательские данные, мы должны их проверять. В компьютерных науках проверка данных - это процесс проверки того, являются ли введенные данные разумными и обоснованными.

Рассмотрите возможность разработки формы для подписки по электронной почте. В этом случае мы хотим проверить, соответствует ли отправленное электронное письмо общему формату, например username@randomMail.com. Без проверки злоумышленники могут вводить бесполезные значения или даже выполнять SQL-инъекции.

В этой статье мы будем выполнять проверку данных формы с помощью Validator.js - облегченного пакета NPM, созданного именно для этой цели.

Повышение производительности JavaScript с помощью GPU.js 

Вы когда-нибудь пытались выполнить сложные вычисления, чтобы обнаружить, что это занимает вечность и замедляет ваши процессы?

Есть много способов решить эту проблему, например с помощью веб-воркеров или фоновых потоков. GPU снимает нагрузку с вашего процессора, давая вашему процессору больше места для других процессов. Между тем, веб-воркеры по-прежнему работают на вашем процессоре, но в разных потоках.

В этом руководстве для начинающих мы продемонстрируем, как использовать GPU.js для выполнения сложных математических вычислений и повышения производительности приложений JavaScript.

JavaScript: как сгенерировать случайное число в диапазоне

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

В этой статье мы рассмотрим, как генерировать случайные числа в JavaScript. Мы также коснемся нескольких встроенных методов работы со случайными числами. В конце мы применим эти знания, написав функцию для моделирования шестигранной матрицы.

Как и зачем использовать медиа-запросы в JavaScript 

Медиа-запросы, впервые представленные в CSS3, составляют основной компонент адаптивного веб-дизайна. Приложения должны быть адаптированы к ограничениям каждого типа устройства (например, мобильных телефонов, планшетов, ноутбуков, настольных компьютеров), и медиа-запросы обеспечивают простой способ установки размеров области просмотра в зависимости от размера устройства, на котором работает приложение.

Медиа-запросы позволяют не только изменять размеры области просмотра в зависимости от размера экрана, но также могут помочь вам установить различные свойства стиля для разных устройств, включая цветовые схемы, стили шрифтов, настройки движения и анимацию, границы и интервалы, и почти любой другой CSS.

На первый взгляд некоторые фронтенд-разработчики упускают из виду тот факт, что медиа-запросы также поддерживаются в JavaScript. Хотя они в JavaScript не так популярны, как в CSS, они обеспечивают гибкость и ряд преимуществ, которые могут сделать их лучшим выбором для определенных случаев использования.

Присоединяйся в тусовку

Поделитесь своим опытом, расскажите о новом инструменте, библиотеке или фреймворке. Для этого не обязательно становится постоянным автором.

Попробовать

Оплатив хостинг 25$ в подарок вы получите 100$ на счет

Получить