Web-разработка

Управление состоянием: Jotai вместо Redux

Самая утомительное при реализации Redux — это написание того объёма шаблонного кода, который нужен для обработки потока данных между компонентами и хранилищем Redux. Сам...

А вы знали, что для HTML Чак Норрис - это цвет?

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

Как разделить монолитное приложение на микрофронтенды

Посмотрим, как разбить большое приложение на более мелкие и независимые компоненты. Это улучшает масштабируемость и гибкость приложения, а также делает более удобным сотрудничество между командами.

Как создать эффективную систему логирования с использованием Aspect и Spring Cloud Sleuth

Логирование крайне важно для оперативного отслеживания ошибок в приложении и установления причины этих ошибок. Разберемся, как без особых усилий настроить фреймворк для логирования в приложении Spring Boot.

Прощай, Ramda

Несмотря на свои сильные стороны, Ramda не всегда подходит для написания эффективного и понятного кода. Рассмотрим случаи, когда стоит придерживаться современного нативного JavaScript и Lodash.

6 шагов по созданию расширения Chrome, которое можно продать

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

Добавление 3D-элементов на сайты с помощью Babylon.js и Vite

Хотите погрузиться в мир веб-разработки с 3D-элементами в 2024 году? Ознакомьтесь с актуальным решением по добавлению на сайты 3D-элементов, воспользовавшись пошаговым руководством по созданию базовой версии проекта Babylon.js + Vite.

Лучшие практики именования переменных в JavaScript

Изучите 12 проверенных практик именования переменных в JavaScript. Следуя им, вы сможете создавать более чистый, хорошо читаемый и удобный в обслуживании код, который принесет пользу как вам, так и членам вашей команды.

Делаем Node.js быстрым: инструменты, техники и советы для создания эффективных серверов на Node.js Часть...

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

Лучшие практики и инструменты для микрофронтендов

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

WebRTC: фреймворк ICE, STUN и сервера TURN

WebRTC (Web Real Time Communication) — это проект с открытым исходным кодом, позволяющий создавать одноранговые (P2P) аудио- и видеосвязи через JavaScript API. Для того чтобы установить P2P-соединение,...

Изучаем CSS Grid на примерах

Вступление Система Grid (сетка) является одной из наиболее полезных функций, добавленных в CSS. Она позволяет выравнивать элементы страницы по столбцам и строкам. CSS Grid упрощает...

Замечательные новые фичи TypeScript 3.5

Новые фичи включают в себя: увеличение скорости для поэтапных сборок; вспомогательный тип Omit;улучшенные проверки избыточных свойств в типах объединения;вывод типов для объединения конструкторов. Увеличение скорости С режимом сборки...

5 тегов HTML, о которых вы могли не знать

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

Производительность фронтенда: лав-стори для разработчиков

Бытует мнение: "Сайт, запускающийся с пустого body, никогда не достигнет высоких показателей Lighthouse". Проверим это утверждение. Предлагаем ознакомиться с технологией производительности фронтенда приложения Neo.mjs, которая принесет множество приятных открытий.

VSCode. 27 расширений для JavaScript разработчика

27 плагинов для Visual Studio Code, которые расширят ваши возможности и повысят эффективность.

Введение в WebAssembly (WASM)

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

7 бесплатных шаблонов React для разработки проектов

Не обязательно начинать работу с нуля! Эти продвинутые шаблоны React помогут создавать проекты легко и быстро.

Перевод любого приложения Vue.js за час

Инструкция по полной автоматизации процесса перевода приложений на любое количество языков с помощью vue-i18n. Настраиваем инструменты, организуем их взаимодействие и получаем возможность мгновенного перевода через Google Translate.

10 источников вдохновения для дизайнера

Во всемирной паутине есть множество отличных инструментов, которые помогают нам в многочисленных задачах каждый день. Так или иначе, мы все периодически ищем вдохновение там...

Погружение в unserialize(): больше, чем RCE

Обход аутентификации и внедрение SQL-кода через unserialize() в PHP Сериализация в PHP через метод unserialize() приводит к появлению уязвимостей, открывающих через RCE (удаленное выполнение кода) доступ...

React SPA SEO с Prerender.io

Как правильно настроить SEO для JavaScript-приложения? Рассказываем про Server Side Rendering, Client Side Rendering, Dynamic Rendering и Prerender.io.

Дизайн системы Netflix

Балансирование между удивительными возможностями и соответствием строгим требованиям - отличительная черта дизайна системы Netflix. Изучение ее "умных" компонентов наверняка обогатит ваш инженерный опыт.

Первые шаги в JavaScript: создание калькулятора

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

10 рекомендаций по повышению производительности от экспертов JS React

Хук слева, хук справа… Отработаем приемы эффективной разработки: применение функциональной архитектуры, мемоизации, разделения кода. Отправим в нокаут лишние повторные вычисления и отображения.

Топ-7 библиотек React

Предлагаем краткий обзор 7 лучших библиотек React, о которых должен знать каждый JavaScript-специалист и React-разработчик, - от Create React App до React Virtualized.

Шпаргалка по основным командам Bash

Неважно кто вы, разработчик ПО, специалист по данным, менеджер ИТ-инфраструктуры или просто любитель компьютеров — вам нужно знать, как пользоваться терминалом в Linux и...

Создавайте веб-приложения, которые умеют говорить! ?

Сегодня трудно себе представить жизнь без Интернета. Интернет даёт огромные возможности. Он позволяет поддерживать связь с миром, не вставая с дивана. Аудиосегмент Интернета растёт...

Создание базовых 3D-сцен с помощью Three.js

Продуманная 3D-графика радует глаз и вдохновляет на новые креативные разработки. Сегодня мы попробуем создать 3D-сцену, используя библиотеку Three.js.

Var, Let, Const - в чем разница?

ES2015 (ES6) принес с собой много новых интересных фич. Теперь на дворе 2020 год, и можно предположить, что многие JavaScript-разработчики уже познакомились с этими...

Введение в Web Share API

С каждым днем новые технологии сокращают разрыв между вебом и нативными приложениями. Один из таких примеров — прогрессивные веб-приложения, которые добавили в Интернет множество...

Мониторинг сайта: просто, но эффективно

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

10 ключевых концепций JavaScript

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

Эмпирический анализ схем GraphQL. Часть 1

Часть 1, Часть 2 В статье приводится краткое изложение научно-исследовательской работы An Empirical Study of GraphQL Schemas, представленной на конференции ICSOC 2019. Большинство авторов работы...

Проектирование устойчивых API: постигаем искусство ограничения скорости

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

Зачем усложнять разработку с AWS Lambda?

Время подискутировать! Автор рассматривает наметившуюся тенденцию усложнять бессерверную разработку с помощью AWS Lambda и высказывается за сохранение простоты и модульности данного сервиса.

У приложений будущего может не быть бэкенда

История циклична. Я создал свой первый веб-сайт в 1999 году с помощью самых передовых технологий, доступных веб-мастерам (не могу использовать слово разработчики в данном случае):...

Не стоит частить с if в JavaScript

Мне нравится воспринимать логику построения условий как хлеб и масло в среде разработки софта. Она позволяет разработчикам создавать интересные, полезные и веселые продукты. Самый распространенный...

На что способен Selenium в паре с JavaScript?

Что получится, если совместить Selenium WebDriver и JavaScript? Ответ: море преимуществ в процессе веб-разработки, повышенная эффективность и качественный результат.

Плохие практики Angular

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

Meteor вместо Next.js: создаем NFT-маркетплейс

Хотите создать собственную версию NFT-маркетплейса, добавив в него новые функциональные возможности? Узнайте о том, как, используя Meteor вместо Next.js в качестве фреймворка, можно разрабатывать Web3-приложения.

Прекратите использовать конфигурационные файлы JSON

История о том, почему мы не должны использовать инструменты для того, что можно сделать с помощью простого JavaScript. Каждый важный инструмент в мире JavaScript позволяет...

TypeScript: расширение возможностей JavaScript

Знакомство с TypeScript - расширенной версией JavaScript - необходимо каждому программисту. Изучите базовые понятия TypeScript: типы, интерфейсы, дженерики и многое другое. Предлагаемый материал изложен простым доходчивым языком, без сложных определений и воды.

Почему в JavaScript, в функцию лучше передавать только один аргумент?

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

6 полезных приемов для создания интерфейсов

Фронтенд-разработка сегодня весьма востребована. Программисты, выполняющие подобные проекты, постоянно сталкиваются со множеством новых задач. Для их решения приходится создавать код с использованием HTML, CSS и...

Перехват ошибок в компоненте React

Поговорим о механизме перехвата ошибок из компонента и отображении резервного компонента («ErrorComponent») в случае возникновения ошибки при отображении компонента. В статье речь пойдёт о следующих...

Разбор позиционирования в CSS

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

Как обрести уверенность дизайнеру

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

Добро пожаловать в ад…зависимостей JavaScript

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

React в плагине Sketch: проблема загрузки исходных данных

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

5 полезных советов для загрузки HTML-файлов

Введение Загрузка файлов на различных платформах — это типичная повседневная задача. Без неё трудно представить себе жизнь в современном мире, ведь все мы обмениваемся фотографиями...

5 непростых вопросов по JavaScript

Разберем пять непростых вопросов: о сравнениях, пустых массивах, странном try catch, стрелочной функции и коварном JSON.stringify. Сможете ответить на них правильно?

Новые API браузера, необходимые каждому веб-разработчику

Современные API браузера повышают производительность разработчиков и даже способны заменить популярные библиотеки для фронтенд-компонентов. Используйте их для создания удобных веб-приложений.

3 важных рекомендации Django-программистам

Django — это очень интересный фреймворк, который позволяет создавать веб-приложения с использованием Python для бэкенда. При этом он также может обрабатывать большинство функций базы...

Оптимизация ресурсов в Node.js

Ресурсы приложения - вещь дефицитная. Узнайте, как оптимизировать их работу, чтобы повысить стабильность, производительность и эффективность системы. Научитесь использовать потенциал Node.js по максимуму!

10 особенностей создания компонентов Vue.js

1. Глобальная и локальная загрузка компонентов Vue.js предоставляет два способа загрузки компонентов: глобально на экземпляре Vue и на уровне компонентов. Каждый метод обладает своими преимуществами. При...

Основы разработки приложений: уровень клиента

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

Базовые команды при работе с узлами K8s

В данной статье мы вспомним основы, чтобы прояснить суть ряда операций при работе с узлами кластера. Тестовый кластер Рассмотрим только что созданный кластер kubeadm, состоящий из...

Хватит везде использовать ===

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

Cначала Vue, потом React: совет начинающим разработчикам

По мнению автора, React категорически не подходит начинающим разработчикам, тогда как Vue является для них идеальным вариантом. В поддержку данного утверждения выдвигаются разные аргументы. Будем разбираться!

Основы создания сайтов

Разбираемся в базовых аспектах разработки сайтов: как они работают и из чего состоят. Предлагаем краткую инструкцию для начинающих.

Запуск с нуля: как я создала сайт с нуля при помощи Netlify + Gatsby

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

AWS WebSocket: написание документации с помощью Async API Spec

Третья статья из серии AWS WebSocket. В ней мы напишем познакомимся с удобным написанием необходимой документации для нашего WebSocket.

10 полезных инструментов для фронтенд-разработчика

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

Введение: 4 новейших операции JavaScript

Технический комитет 39 (TC39) — это группа экспертов по JavaScript, которые работают над стандартизацией ECMAScript. Рабочий процесс TC39 состоит из нескольких этапов: Этап 0 (Идея): прием...

3 способа клонирования объектов в JavaScript

Поскольку объекты в #JavaScript являются ссылочными значениями, их нельзя просто скопировать с помощью =. Но не беспокойтесь, существует 3 способа клонирования объекта ?. const food...

Kubernetes: преимущества простых кластеров

Какими же сложными стали со временем Kubernetes и облачная экосистема! Не надо далеко ходить за примером, достаточно лишь вспомнить ландшафт CNCF Landscape, на текущий...

Rust для разработчиков JS

Rust не вызвал у меня большого интереса, когда я впервые прочитал о нём. Это было около двух лет назад. Я работал веб-разработчиком, программировал в...

Лучшие библиотеки React 2024 года

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

Rest и Spread в JavaScript. Возможности, о которых вы не знали

Операторы Rest (остаток) и Spread (расширение) можно использовать не только для разделения и соединения отдельных значений массивов. Здесь я собрал 7 малоизвестных способов использования...

Создание эффектов при прокрутке

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

Ключевые понятия JavaScript, которые должен знать каждый разработчик — часть 1

Предлагаем 32 ключевых понятия JavaScript, собранные из 50+ руководств. Они помогут усвоить премудрости JavaScript, чтобы создавать оптимизированный код и избегать ошибок. В этой части будут раскрыты первые 11 понятий, включая стек вызовов, примитивные типы, типы-значения, ссылочные типы, системы типизации, операторы равенства и др.

25 полезных сокращений в JavaScript для веб-разработчиков

Сегодня вы узнаете о множестве сокращений в JavaScript, которые можно использовать, чтобы сделать код более читабельным, лаконичным и профессиональным.

Что нового ожидать в ES2021

В июне 2021 года намечен выход ES2021 или ES12. Вот некоторые функции, которые предположительно внесет технический комитет 39 (TC39) в ESMAScript: · Метод String.prototype.replaceAll · Метод...

Protractor мертв, да здравствует Cypress!

24 апреля платформа Angular объявила об отказе от своего инструмента сквозного тестирования (E2E) Protractor. Остается неясным, готовит ли Angular преемника Protractor или поручит это...

Анализ работы Guess.js в приложении Angular

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

Проект инженерии данных с DAG Airflow «от и до». Часть 1

В реальном проекте валидации электронной почты проиллюстрируем потоковую передачу данных с отправителем и получением сообщений в теме Kafka для Cassandra и MongoDB. Наличие почты и пароля определим с помощью получателя и проверки данных.

Продвинутые методы программирования на JavaScript: сравнение элементов двух массивов

Хотите писать более профессиональный код на JavaScript? Заметных успехов при сравнении двух массивов позволят добиться решения опытного разработчика.

8 советов, как стать лучше во фронтенд-разработке

Должен ли я планировать свой проект или лучше сразу погрузиться в процесс разработки? Стоит ли мне внедрить вот этот плагин или вон ту библиотеку?...

Несложное WebGPU-программирование с использованием taichi.js

Фреймворк taichi.js позволяет создавать захватывающий графический контент без освоения сложного WebGPU-программирования. Убедитесь в этом на примере игровой программы "Жизнь". Потребуется менее 100 строк кода, чтобы разработать распараллеленную WebGPU-программу с 3 конвейерами вычислений и конвейером рендеринга.

Почему стоит избегать метода push при разработке на JavaScript

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

Сравнение производительности JS-фреймворков на RealWorld Demo

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

Полное руководство по кэшированию Laravel

На примерах изучим cache:remember, самый применяемый в проектах метод кэша. Узнаем, как эффективно кэшировать данные, оптимизируя производительность и пользовательское взаимодействие, снижая нагрузку на базу данных и убыстряя отклик.

Как реализовать редактор форматированного текста в вашем React-приложении

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

Репозитории GitHub в помощь каждому веб-разработчику

Я недавно узнал о репозитории с полезным контентом (что для меня самое важное) и решил углубиться в тему, составив список репозиториев GitHub, которые принесут...

5 способов уменьшения размера пакетов JavaScript

Громоздкие пакеты мешают продуктивности приложения? Решение есть. Сегодня вы узнаете 5 методов оптимизации приложения путем уменьшения размера пакетов JavaScript.

11 новых возможностей JavaScript в ES13

Представляем новейшие возможности JavaScript в ES13. Используйте их, чтобы повысить свою производительность и писать более чистый код с высокой степенью лаконичности и ясности.

PHP: строки

Строки представляют собой последовательности символов, например "PHP supports string operations". Строки с одинарными кавычками обрабатываются почти буквально. Строки с двойными кавычками заменяют переменные на их значения, а также особым образом интерпретируют определенные последовательности символов.

Руководство для начинающих по созданию с нуля сайта онлайн-курсов или e-коммерции

Востребованность онлайн-бизнеса, как мы знаем, привела к повышению спроса на сайты и приложения. Это отлично понимают Google и Facebook — главные конкуренты на интернет-рынке. Именно...

Движок JavaScript: что внутри

Введение Чтобы разобраться в том, как работает механизм обработки кода (иначе говоря, движок JavaScript), надо понять, что происходит при выполнении кода. Такие знания помогают программистам...

Как работает JavaScript Proxy

Раскройте для себя возможности JavaScript Proxy, углубившись в настройку операций с объектами и контроль над ними. Используя JavaScript Proxy, вы будете создавать надежные и безопасные приложения.

Проблемы при использовании отзывчивого веб-дизайна

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

4 пользовательских хука React, которые должен знать каждый разработчик

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

Топ-10 бэкенд-фреймворков для веб-разработки в 2022 году

Предлагаем познакомиться с лучшими бэкенд-фреймворками для веб-разработки на Java, Ruby, Python, JavaScript, PHP, Scala и Golang на 2022 год.

11 главных фронтенд-трендов на 2020 год

1. Микрофронтенды Звучит иронично, но несмотря на то, что фронтенд-разработка обладает модульными преимуществами компонентов, она все еще более монолитна, чем бэкенд-микросервисы. Микрофронтенды предоставляют возможность разделения фронтенд-архитектуры...

Как создать GraphQL-сервер с запросами, мутациями и подписками

Если вы ещё не знакомы с TypeScript — не беда. Продолжайте читать дальше: основные понятия и большую часть синтаксиса освоить будет несложно. Предполагается, что у вас...

Решение головоломки судоку на JavaScript с помощью хэш-карт и рекурсий

Если вы погружены в мир судоку, то наверняка ищете варианты ускоренного решения задач по программированию. Предлагаем ознакомиться с одним из них. Использование в нем хэш-карт и рекурсий значительно ускоряет решение головоломки.

Собеседование по Angular: ответы на часто задаваемые вопросы

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

10 лайфхаков JavaScript, которые сделают из вас профессионала

Опытные JavaScript-программисты владеют приемами, которые неизвестны новичкам. Познакомьтесь с 10 из них: они сделают код качественнее, а вас - более профессиональным программистом.

Как не лажать с JavaScript. Часть 3

Часть 1, Часть 2, Часть 3 Изменяемое состояние Что такое состояние? Говоря простым языком, состояние — это любые временные данные, хранящиеся в памяти. Например, это могут быть переменные...

Все что касается web-разработки: Front end, Back end, Full stack; HTML, CSS, JavaScript, фреймворки, технологии, безопасность и многое другое!