Работа с REST API с использованием Fetch

Fetch API используется для выполнения HTTP-запросов и обработки ответов.

#полезное

Интересные трюки HTML. Экстремальный минимализм

Мы уже много говорили про оптимизацию сайтов до минимального размера, преимущества статичного HTML, а также упаковку сайта (и веб-сервера) в портативный формат одного исполняемого файла, который нативно исполняется под любой ОС.

#статья

❤️ Прожимай реакции, если нравится такой формат

👉 Читать статью

Использование Object Destructuring

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

#полезное

Как сгенерировать безопасный, типизированный Node.js API с использованием Prisma, TypeGraphQL и graphql-query-purifier

Создание эффективного Node.js API, обеспечивающего безопасность данных и типобезопасность, может быть сложной задачей. Это руководство демонстрирует процесс с использованием Prisma, TypeGraphQL и graphql-query-purifier.

#статья

❤️ Прожимай реакции, если нравится такой формат

👉 Читать статью

Использование Event Delegation для обработки событий

Event Delegation позволяет обрабатывать события на родительском элементе, вместо назначения обработчиков на каждый дочерний элемент отдельно.

#полезное

Удобные формы для Vue 3

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

#статья

❤️ Прожимай реакции, если нравится такой формат

👉 Читать статью

Использование метода bind() для установки контекста функции

Метод bind() используется для создания новой функции с определенным контекстом выполнения.

#полезное

Кулинарный гид по Vue.js: всё о props

В этой статье разберемся, как frontend-разработчику готовить на «кухне» props. Выбирайте подходящий уровень сложности: джуны-поварята смогут лучше разобраться в работе и применении props на фреймворке Vue.js, а еще мы затронем тему валидации. Для мидлов и более опытных специалистов — настоящих шеф-поваров мы приготовили продвинутые кулинарные техники props, где можно освежить в памяти некоторые детали или решить проектную проблему, если замылился глаз. 

#статья

❤️ Прожимай реакции, если нравится такой формат

👉 Читать статью

Использование sessionStorage для временного хранения данных на клиенте

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

#полезное

React + Three.js. Создаём собственный 3D шутер

В современной веб-разработке границы между классическими и веб-приложениями стираются с каждым днём. Сегодня мы можем создавать не только интерактивные сайты, но и полноценные игры прямо в браузере. Одним из инструментов, который делает это возможным, является библиотека React Three Fiber - мощное средство для создания 3D-графики на основе Three.js с использованием технологии React.

#статья

❤️ Прожимай реакции, если нравится такой формат

👉 Читать статью

Манипуляция с элементами страницы: создание, удаление и изменение HTML-элементов

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

В данном примере мы создаем новый элемент div с текстом "Новый элемент" и классом "my-class". Затем мы добавляем этот элемент в конец body документа с помощью метода appendChild(). Мы также изменяем содержимое элемента с помощью свойства textContent и стилизуем его, устанавливая значение свойства backgroundColor.

Через 3 секунды мы удаляем элемент с помощью метода remove(). Это демонстрирует возможность удаления элементов из документа.

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

#полезное

Увеличиваем свою производительность в WebStorm / PhpStorm c помощью шаблонов

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

#статья

❤️ Прожимай реакции, если нравится такой формат

👉 Читать статью

Асинхронные запросы с использованием fetch()

fetch() используется для отправки асинхронных HTTP-запросов. В примере мы отправляем запрос к удаленному серверу, ожидаем ответ в формате JSON и выводим данные или обрабатываем ошибку.

#полезное

8 продвинутых вопросов для собеседования по JavaScript

Хотите стать JS-специалистом? Тогда стоит детально разобрать ключевые вопросы для собеседования по JavaScript. Это поможет вам усвоить основные понятия и успешно ответить на другие вопросы.

#статья

❤️ Прожимай реакции, если нравится такой формат

👉 Читать статью

Сортировка массивов объектов

В примере мы создаем массив объектов products, содержащий информацию о различных продуктах. Затем мы используем метод sort() для сортировки этого массива по полю price в порядке возрастания, используя функцию sortByPriceAscending в качестве функции сравнения. Вы можете создать аналогичные функции для сортировки в порядке убывания или для сортировки по другим полям объектов.

#полезное

Мои первые шаги в создании браузерных 2D игр на чистом JavaScript + Canvas

Статья представляет собой перевод одного англоязычного видеоурока. Если Вы хорошо владеете английским и Вам больше нравится видеоформат подачи материала — можете посмотреть видео. В статье же я буду вставлять участки кода и стараться также подробно как и автор видео — объяснять каждый свой шаг.

#статья

❤️ Прожимай реакции, если нравится такой формат

👉 Читать статью

Генерация случайных чисел

В примере мы используем Math.random() для получения случайной десятичной дроби между 0 и 1. Затем мы масштабируем и округляем эту дробь, чтобы получить случайное целое число в заданном диапазоне (включая минимальное и максимальное значение).

#полезное

Сайд эффект реактивности и апдейта компонента во Vue 3

Хочу рассказать о небольшом кейсе, связанном с работой реактивности во Vue 3. Кейс касается взаимосвязи ref/reactive, v-for/v-if, :class, функций и того, что у нас находится в <template>. Сразу оговорюсь, что под капотом не смотрел, поэтому детальных объяснений не ждите. Наоборот, хотелось бы услышать ваши мнения, сталкивались ли вы с подобными сайд эффектами.

#статья

❤️ Прожимай реакции, если нравится такой формат

👉 Читать статью

Локальное хранилище браузера с использованием объекта localStorage

В примере мы используем объект localStorage, доступный в браузере, чтобы сохранить данные, такие как имя пользователя и адрес электронной почты. Мы используем метод setItem() для сохранения данных и метод getItem() для получения данных. Мы также демонстрируем, как можно удалить данные из локального хранилища с помощью метода removeItem().

#полезное

Как внедрить гайд по стилю кода в проект

Практикум появился в 2019 году и с тех пор растёт. В какой-то момент нам стало сложно погружать новичков в проект. Дело в том, что стиль кода всё время развивался, но правила оставались на уровне устных договорённостей. В итоге приходили новые тиммейты, видели легаси и более свежий код — и не понимали, какой написан правильно и почему они разные. Как следствие, код-ревью растягивалось, и тестирование проходило в разы сложнее. Люди чувствовали себя неуютно в таких процессах. 

#статья

❤️ Прожимай реакции, если нравится такой формат

👉 Читать статью

Асинхронные HTTP-запросы с использованием современного API Fetch

В примере мы используем fetch для отправки GET-запроса к удаленному серверу. Мы обрабатываем результат запроса с использованием асинхронного синтаксиса с await и async. Если запрос выполнен успешно (HTTP-код 200), мы преобразуем полученные данные в JSON и выводим их в консоль. В противном случае, мы ловим ошибку и выводим сообщение об ошибке.

#полезное