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

Как реализуется пользовательское взаимодействие на страницах JavaScript?

Рассмотрим процесс регистрации на интернет-странице изнутри: что происходит при нажатии на кнопку регистрации, появлении формы, ее заполнении и отправке пользователем, а также при перенаправлении на страницу авторизации и получении полного доступа к странице. Узнаем, куда поступает эта информация и как страница распознает пользователя, когда он снова на нее заходит.

Новые функции в TypeScript

Введение TypeScript — это сильно типизированный, объектно-ориентированный и компилируемый open-source язык, разработанный и поддерживаемый компанией Microsoft. Он был создан в целях привнесения статических типов в современный JavaScript....

Супербыстрый веб-фреймворк Astro: подробный обзор

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

PHP: типы переменных

Основным способом хранения информации внутри PHP-программы является использование переменных. Рассмотрим типы данных для их создания.

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

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

Как посещать сайты, не заходя в браузер

Узнайте, как взаимодействовать с сайтом без браузера, используя "безголовый" Chrome, простой JavaScript и контейнеры Docker.

Что такое Deno и заменит ли он NodeJS?

Для тех, кто не совсем в теме, Deno — это детище Райана Даля, ставшего известным благодаря созданию Node.js, который вам, наверняка, знаком. Значит ли это, что...

Динамические заголовки страницы в Angular

Angular — это MVC-фреймворк для создания одностраничных приложений в Javascript. В этой статье мы узнаем, как установить заголовок браузера (страницы/документа) для всего приложения и как изменить заголовок...

PHP: типы операторов

Предыдущая часть: “PHP: типы констант” PHP поддерживает следующие типы операторов: арифметические операторы;операторы сравнения;логические (или реляционные) операторы;операторы присваивания;условные (или тернарные) операторы. Посмотрим, что делает каждый тип. Арифметические операторы Предположим, что переменная...

Повесть об однонаправленном потоке данных в Angular

У Angular есть свои фишки и причуды. В то время как React реализует модель однонаправленного потока данных по умолчанию, Angular с самого начала точно...

Погружение в JavaScript

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

Баланс между креативностью и удобством

Дискуссия «креативность против юзабилити» длится уже более ста лет. Как я уже писал, она тесно связана с технологическими разработками и промышленными революциями. Чтобы достичь...

5 важных моментов из JavaScript, которые помогут избегать ошибок

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

Какой метод глубокого клонирования в JavaScript наиболее эффективный — исследование

Чтобы выделить "победителя" среди методов глубокого клонирования в JavaScript, необходимо протестировать каждый из них. Предлагаем результаты серии модульных тестов.

Создаем Telegram-бота с помощью Node.js за 3 минуты

Одна из интересных особенностей Telegram заключается в возможности создать собственного бота. Он помогает автоматизировать и упрощать повседневные задачи. Узнаем, как сделать простого бота с помощью Node.js.

Реализация шаблона Saga в микросервисах с помощью Node.js

Рассматриваем особенности использования шаблона Saga при создании приложений с наиболее востребованной сегодня микросервисной архитектурой.

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

В первой части были представлены первые 11 из 32 ключевых понятий JavaScript. В этой части будут раскрыты следующие 11 понятий, включая побитовые операторы и буферы массивов, DOM и деревья макетов, фабрики и классы, ключевое слово this и методы call, apply, bind и др.

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

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

Создание UI-компонентов React на продвинутом уровне

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

Java и Spring Boot: 7 трендов, которые изменят бэкенд-разработку в 2026 году

Java-платформа не просто выживает — она незаметно захватывает лидерство. Пока все увлекались новомодными языками, платформа совершила рывок, о котором вы могли и не узнать. Вот 7 трендов 2026 года, которые заставят вас переписать свои старые сервисы.

Реализация React Query в веб-приложении

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

6 способов как веб-дизайнеру понять пользователя

Пользователи не читают, они просматривают страницу Зайдя на сайт, пользователи быстро пробегаются по нему. Они не читают, а просматривают. И этот «просмотр» проходит ещё быстрее,...

Руководство по Webpack для начинающих

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

Три библиотеки для удаления неиспользуемого CSS

В обзоре состояния CSS на 2020 года был раздел, посвященный служебным библиотекам. Речь в нем шла о StyleLint, Purge CSS и PurifyCSS. Две из...

7 приложений и сайтов, которые облегчат работу UX/UI дизайнера

Рассмотрим 7 приложений и сайтов для UX/UI дизайнера и подробно изучим основные функции, особенности и области использования каждого из них.

Автоматическое пакетирование в React 18

Предлагаем подробно ознакомиться с автоматической пакетной обработкой в обновленном React 18. Эта функция позволит существенно повысить производительность приложения.

10 конструкторов сайтов с ИИ, которые стоит попробовать каждому UI/UX-дизайнеру

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

Поэтапное создание рабочей контактной формы в Next.js

Учимся создавать контактную форму для эффективного взаимодействия с пользователями. В этом важном деле нам помогут API-маршруты Next.js и API SendGrid.

Как использовать библиотеку веб-компонентов React от Uber

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

Использование лямбда-авторизатора с AWS WebSocket

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

JWT-аутентификация в Spring Boot Webflux

Spring Security всегда снижал мой интерес к собственным проектам. Как только возникала необходимость выяснить как аутентифицировать пользователей, я сразу начинал испытывать негодование или скуку...

7 лучших библиотек для создания эффективных приложений ReactJS

Библиотека ReactJS выделяется своей производительностью. Но теперь у нас появилась возможность еще больше ее усовершенствовать. Сообщество пользователей React создало несколько дополнительных весьма эффективных библиотек. Рассмотрим...

Как тестировать компоненты React

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

5 правил ESLint для применения новейших возможностей Angular

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

Мой любимый вопрос на собеседовании для веб-разработчиков: «Понимаете ли вы, что такое массивы?»

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

JavaScript async/await: что хорошего, в чём опасность и как применять?

Механизм async/await , представленный ES7, является фантастическим улучшением асинхронного программирования с использованием JavaScript. Он предоставил возможность использовать код, написанный в синхронном стиле, для асинхронного доступа к...

Laravel: неизвестный, но эффективный способ реализации фильтров в Eloquent

Фильтровочный конвейер: как его задействовать для построения запроса пользователей в Eloquent с применением фильтрации? Научимся реализовывать простой и выполнимый процесс фильтрации с конвейером.

5 недооцененных возможностей JavaScript

Скорее всего, вы не используете эти 5 методов работы с JavaScript. Их можно отнести к одним из самых недооцененных возможностей TypeScript. Впрочем, у вас есть шанс восполнить этот пробел.

Streamlit для создания интерактивных веб-приложений: начало

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

Как создать приложение на Go с gRPC

Разберем преимущества gRPC, 4 типа API и буферы протокола. Реализуем сервер и клиент на Golang с gRPC потоковой передачи данных: определим сообщения и сервисы, сгенерируем для них интерфейс и добавим функциональность.

Как создать аналитический сайт на Python с нуля

Представляем обучающее руководство по разработке сайта на основе шаблона Flask. Сайт включает блог, приложения Dash и блокноты Jupyter.

7 полезных атрибутов HTML, о которых не все знают

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

React SPA SEO с Prerender.io

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

Технические долги при проектировании компонентов с помощью Angular

Изучите три стратегии реализации пользовательских компонентов: превалирование ControlValueAccessor, использование FormControl в качестве входных данных и обертывание компонентов. Чтобы эффективно применять эти стратегии, рассмотрите технические долги, связанные с каждой из них.

11 малоизвестных, но полезных приемов по фронтенду

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

Простая защита от DoS и брутфорс атак

Наиболее типичными и опасными являются DoS(DDoS) и брутфорс атаки. Оба их вида подразумевают ежесекундную отправку тысячи запросов, которые перегружают сервера. Зачем такое позволять? Сегодня...

Создание пользовательских хуков React: полное руководство

Пользовательские хуки React помогают оптимизировать разработку и создавать более динамичные и эффективные приложения. Предлагаем полное и доступное руководство по их созданию и использованию.

Отладка кода на Python с помощью icecream

Вопрос: какую из стандартных функций Python разработчики используют чаще всего? Наверняка, как и в большинстве языков программирования, ответом будет функция print(): во время разработки...

Структура типизации в Ruby 3

Об авторе: Соутаро является ведущим разработчиком Ruby в Square, работающим над Steep и статической типизацией; вместе с Матцем и другими разработчиками ядра он работает...

Правила безопасного завершения работы монолитного финтех-приложения

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

7 основных навыков, необходимых для фронтенд-разработчика в 2021 году

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

StreamForge: настраиваемый дашборд мониторинга метрик Kafka

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

От HTTP до HTTP 3 - интернета будущего

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

OutSystems: взаимодействие в реальном времени

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

Совместное использование компонентов React с Webpack 5

Поработаем с двумя приложениями и научимся совместно использовать компоненты React между ними. А поможет нам в этом важном деле плагин Webpack 5 Module Federation.

Изучаем gRPC и Flutter для разработки современных приложений

Научимся работать с файлом .proto, генерировать код Dart с protoc и модифицировать приложение Flutter для применения gRPC вместо HTTP. А также взаимодействовать с API-интерфейсом и напрямую с gRPC.

Что такое Редьюсеры: Как использовать их без Redux

Обработать состояние можно с помощью редьюсера в Class Components, используя функцию, преобразующую действия в изменения состояния. Благодаря этому централизируются все функции setStates. ? Что такое...

Почему не стоит писать простой код JavaScript?

Доводы, которые приведены в этой статье, заставят вас раз и навсегда отказаться от написания динамически типизированного кода JavaScript!

Интеграция Rust в Next.js: практическое руководство для разработчика

Как добавить Rust в свой инструментарий и проекты? Рассмотрим различные варианты развертывания кода Rust на Vercel с написанием конечных точек API, общие закономерности разработки API, проблемы применения Rust в продакшене. Весь код и примеры ― в шаблоне.

7 способов сократить код JavaScript

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

Что делает сайты медленнее?

Аналитики CatchJS отрендерили 1 миллион самых популярных сайтов. Они отследили разнообразные метрики производительности, учли каждую ошибку и отметили каждый запрошенный URL. Результат составляет, вероятно,...

Я разработал и запустил MVP продукт за 5 дней

За последний год я запустил несколько продуктов, каждый из которых потребовал от 3 до 6 месяцев от момента возникновения идеи до запуска. В то...

Как улучшить производительность сайта с помощью мониторинга реальных пользователей

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

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

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

Как создать двойной слайдер для переключения между формой входа и формой регистрации

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

Input и Output в компонентах Angular

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

Великолепная десятка библиотек SVG иконок

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

Как с помощью Sentry реализовать захват исключений фронтенда

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

Как работает новый await верхнего уровня в JavaScript

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

Познай прокси-объект JavaScript как самого себя

Первым делом ознакомимся с официальным определением Proxy на сайте веб-документации MDN, которое гласит: “Объект Proxy позволяет создавать прокси для другого объекта, обладая способностью перехватывать и...

Web Speech API в JavaScript: от текста к речи

Практическое руководство по работе с Web Speech API в JavaScript. Рассказываем, как создать веб-страницу, реализующую преобразование текста в речь.

Визуализация данных и веб-отчёты в Angular

Недавно я столкнулась со следующей проблемой: мне нужно было найти полностью настраиваемые веб-компоненты, с которыми несложно взаимодействовать и которые могут использоваться как встроенные BI-инструменты...

7 ключевых вопросов на собеседовании по JavaScript

Проверьте, насколько хорошо вы разбираетесь в JavaScript! Ответив на эти 7 вопросов на собеседовании по JavaScript, вы наверняка получите работу. Примеры пошаговых объяснений решений помогут основательно разобраться в каждой из 7 концепций.

Aurora UI - новый визуальный тренд в 2021 году

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

Основные различия между React.js и React Native

Раскройте для себя уникальные аспекты двух мощных технологий - React.js и React Native. Это позволит вам в полной мере оценить потенциал универсальной React-библиотеки. Кроме того, вы узнаете, легко ли веб-разработчику React освоить разработку React Native.

5 способов стилизовать компоненты React в 2019

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

Навыки фронтенд-разработчика, которые будут важны в 2026 году

Забудьте о погоне за трендами. Ваша ценность в глубоком понимании JavaScript, React, CSS, разумном подходе к проблеме производительности и инженерном мышлении. Это практическое руководство поможет вам быть востребованным в 2026 году.

10 концепций разработчика Laravel

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

Что такое Hoisting в JavaScript

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

Звучащий UI: роль звуков в интерфейсе

Ежедневно для сбора информации и взаимодействия с окружающим миром мы используем комбинацию зрения и слуха. Однако в веб-интерфейсах эта комбинация всё ещё не отражена — большинство...

Основы дизайна, которые должен знать каждый креативщик

Обычный поиск в Google по запросу “образовательные онлайн-ресурсы по дизайну” даёт миллионы результатов — вовсе неудивительно, что понимание того, с чего начинать изучение, может показаться дизайнеру-новичку...

Ускоренный запуск системы “Аутентификации + база данных” (React.js и Firebase)

Настройка интегрированной системы аутентификации и базы данных отнимает много времени у разработчиков полного цикла. Предлагаем руководство по ускоренному (и бесплатному) запуску системы React.js и Firebase (хотя оно подойдет и для разработки Next.js-приложений).

Тренды UX/UI дизайна на 2024 год

Узнаем о новом тренде Bento UI. Познакомимся с трендами в пространственном дизайне, а также в сфере анимации и 3D. Рассмотрим инструменты с ИИ для дизайнеров. Узнаем о новых тенденциях и требованиях в сфере UX.

REST API для приложения со Spring Boot, Kotlin и Gradle

Я много раз пытался спроектировать API для своих приложений, и это всякий раз заканчивалось разочарованием по одной из этих причин: Недостаточное понимание языка или фреймворка.Неготовность...

Создание многопользовательской игры с использованием Socket.io при помощи NodeJS и React

Кратко знакомимся с Socket.io, а затем пошагово рассматриваем создание проекта, начиная с архитектуры сервера и структуры каталогов, заканчивая настройкой каналов и подключений.

Современное приложение выбирает… Redux, Context или Recoil?

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

15 сайтов, экономящих время разработчика

Хотите выделить время, чтобы взяться за новые увлекательные задачи, углубиться в сложные проблемы или просто уходить с работы вовремя? Эти 15 сайтов помогут значительно сократить процесс разработки.

Как избавиться от операторов switch - малоизвестный способ

Простой способ облагородить свой код Скорее всего, вы, как и я, научились не перегружать исходный код операторами if . Они трудно читаются. Такой код сложно проверить и...

Обзор синтаксиса PHP

Данный раздел даст вам представление об основах синтаксиса PHP. Он очень важен для понимания базовых особенностей языка.

Как с With() улучшить написание кода на Swift

Все мы писали код, в котором какая-то функция создавала и возвращала сконфигурированный объект. func makeButton(_ title: String?) -> UIButton { let button...

Совместное использование кода в микросервисах и микрофронтендах: в чем разница

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

Доступная и масштабируемая 3-уровневая архитектура AWS

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

Самые значимые психологические исследования в UX-дизайне

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

Как ускорить сайт с помощью Varnish HTTP Cache и Docker

Полная инструкция с наглядным описанием методики, необходимой конфигурации и настроек, а также бенчмарками.

10 правил проектирования взаимодействия, которые нельзя нарушать

Есть в жизни правила, нарушать которые нельзя: нарушишь — дорого заплатишь. В UI-дизайне такие тоже есть, и они называются “эвристика”, или общие правила улучшения юзабилити пользовательских...

10 самых серьезных ошибок в UX/UI-дизайне

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

Размеченные объединения в TypeScript

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

Как использовать ESLint, чтобы повысить качество кода JavaScript и TypeScript

Улучшите качество кода JS/TS с помощью ESLint. Благодаря этому инструменту, код будет выполнен в едином стиле и без ошибок. Его будет легче просматривать и поддерживать, что благоприятно скажется не только на судьбе вашего проекта, но и на вашей карьере.

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

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

Глубокое погружение в Nuxt.js

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

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