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

Лучшие практики манипулирования JS DOM – с примерами

В JavaScript вы можете манипулировать содержимым веб-страницы, используя объектную модель документа (DOM). Но как написать код, который будет читабельным, простым в обслуживании и не подверженным проблемам с производительностью? Это то, что мы рассмотрим в этой статье. Я расскажу о некоторых важных передовых практиках, которые помогут вам уверенно манипулировать DOM.

Неизменяемость в JavaScript – объяснение на примерах

Мы часто слышим термины: неизменяемый и неизменяемость. Но что они означают, и почему нас, разработчиков, это должно волновать?

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

Но большинство программ требуют создания, обновления и удаления данных. Так зачем же нам вообще работать с данными, которые невозможно изменить?

Избегайте использования экспорта по умолчанию!

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

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

Обнаружение и размытие человеческих лиц с помощью искусственного интеллекта в NextJS

Вы когда-нибудь загружали в Интернет фотографию с лицами других людей и задавались вопросом, как сохранить их конфиденциальность? Обнаружение и размытие лиц — важная функция конфиденциальности, которую должны иметь все приложения.

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

В этом блоге я покажу вам живую демонстрацию и то, как вы можете реализовать это в своем приложении NextJS/React, используя мощные API-интерфейсы компьютерного зрения PixLab.

Защита объектов JS с помощью прокси

Задача охранника — защищать что-то или кого-то и перехватывать потенциальные взаимодействия с объектом, который он охраняет. Здесь мы поговорим об охраннике, чья работа — защищать объект JavaScript! И использование этого охранника бесплатно! Ну, давайте перейдем к делу.

Как построить шахматную партию в React.js

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

Создание порталов в React с помощью хука usePortal

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

В этой статье мы рассмотрим специальный хук React под названием usePortal, который упрощает процесс создания порталов в ваших приложениях React.

Проблема "undefined this keyword variable" в JavaScript

Проблема "undefined this keyword variable" в JavaScript обычно возникает при попытке доступа к свойству или методу с использованием this в функции, но контекст этого потерян или установлен неправильно. Есть несколько способов решения этой проблемы:

Как победить Concurrent Mode и Suspense в React

Конкурентный режим (Concurrent Mode) и suspense - это две функции, меняющие правила игры, которые были представлены в последних версиях React. Они позволяют создавать более отзывчивые и производительные приложения, раскрывая возможности параллельного рендеринга и приостановленной загрузки. В этом руководстве мы подробно рассмотрим обе функции и дадим практические советы о том, как эффективно использовать их в ваших собственных приложениях React.

Аутентификация приложения Next.js с помощью аутентификации интерфейса Hanko

Hanko — это легкое решение для аутентификации пользователей с открытым исходным кодом, которое поможет вам выйти за рамки паролей.

Интегрируйте Hanko с Next.js

Узнайте, как быстро добавить аутентификацию и профиль пользователя в приложение Next.js с помощью Hanko.
Сначала создайте новое приложение Next.js.

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

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

Попробовать

В этом месте могла бы быть ваша реклама

Разместить рекламу