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

Encore.ts — в 9 раз быстрее Express.js и в 3 раза быстрее Bun +...

Авторы Encore.ts — нового фреймворка для бекэнда на TypeScript показывают бенчмарки и рассказывают о причинах производительности продукта с открытым исходным кодом. Кроме прочего, Encore.ts на 100% совместим с Node.js. Подробности читайте по ссылке ниже.

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

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

7 советов по очистке кода React

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

Изучите эти основы JavaScript и станьте лучшим разработчиком

В языке JavaScript есть примитивы, объекты и функции и все они рассматриваются в качестве объектов, даже примитивы. Примитивы Число, булевый (логический) тип данных, строка, undefined и...

Kubernetes: сэкономьте до 50% с вытесняемыми объектами

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

Функции-генераторы в JavaScript для оптимизации памяти

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

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

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

Angular-приложения универсальной сборки

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

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

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

Почему разрабатывать веб-интерфейсы так сложно?

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

Компиляция TypeScript в нативный код

Представляем Static Hermes - новое поколение движков JavaScript. Ключевой особенностью его является опциональная компиляция JavaScript с указанием типов в нативный код, обеспечивающая предсказуемую производительность на уровне C и C++.

9 инструментов CSS, которые пригодятся в 2022 году

Хотите повысить свою производительность? Освойте несколько классных инструментов и ресурсов CSS. Они значительно упростят вашу работу и сэкономят массу времени!

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

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

Получение общих данных в Next.js одним запросом

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

8 советов, которые сделают JavaScript-код чище

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

7 факторов, которые помогут улучшить UX-дизайн

Чтобы улучшить UX, нужно знать «слабые места» интерфейса. Есть типичные «проблемные зоны», на которые дизайнеру следует обращать особое внимание. Обычно именно здесь кроются причины...

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

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

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

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

Элементы управления выбором в пользовательском интерфейсе

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

Введение в GraphQL: основные принципы использования

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

Темная сторона Javascript: избегайте данных трех функций

Оператор Void Вы, вероятно, уже сталкивались с этим оператором. Раньше при наличии ссылки, запускающей функцию JavaScript, нужно было добавлять href=”javascript:void(0)”, чтобы действие по умолчанию не...

Интересные подробности об объектах JavaScript

Объекты в JavaScript являются основой. Так что более глубокое их изучение позволит писать вам более чистый и производительный код. Примечание: эта статья подразумевает наличие у...

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

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

Почему написание собственного кода делает вас лучшим разработчиком

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

Как создать Chrome-расширение для приложения с прогнозом погоды

Хотите создать простое веб-приложение, чтобы быстро узнавать прогноз погоды? Воспользуйтесь доступным руководством по разработке Chrome-расширения для приложения с прогнозом погоды (с полным исходным кодом).

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

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

Профессиональная обработка ошибок в TypeScript

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

Почему стоит задуматься о разработке статических сайтов

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

Обработка аутентификации и авторизации пользователей после балансировки нагрузки веб-приложения

Балансировка нагрузки необходима, если в приложении ожидается или уже есть большой объем трафика, но дело усложняется, когда доходит до разработки потока аутентификации и авторизации. Зачем...

Микрофронтенды - а почему бы и нет?

Фронтенд-разработка всегда занимала положение младшего ребенка в семействе веб-приложений. И пока фронтенд-разработчики расхаживали в своих модненьких шапочках, с аккуратными усиками, MacBook и дорогим кофе,...

Kubernetes избавляется от Docker

Как многие уже знают, Kubernetes с версии v1.20 прекращает использование Docker в качестве среды выполнения. Выбор сделан в пользу тех сред, что задействуют Container...

Новые правила дизайна интерфейсов в Google

На собственной ежегодной конференции Google I/O компания представила первые изображения будущего дизайна интерфейсов под названием “Material You”. Такие радикальные изменения приходят на смену концепции...

Как преобразовать шестнадцатеричное число в десятичное в JavaScript

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

Проблема IDOR: несанкционированный отзыв сессии пользователя

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

8 репозиториев, которые используют продвинутые React-разработчики

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

Движки JavaScript. Часть 2: генерация кода и базовые оптимизации

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

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

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

Удаленные вызовы процедур с запросом-ответом

За последние два года я много работал с удаленными вызовами процедур (RPC), применяя этот подход для взаимодействия между нашими микро-сервисами. В подобных ситуациях RPC...

Как очистить код с помощью SASS

Итак, давайте знакомиться с SASS SASS (Syntactically Awesome StyleSheets — Синтаксически потрясающие таблицы стилей) является препроцессорным скрипт-языком, код которого компилируется в CSS, чтобы быть понятым браузерам. У SASS...

Почему я перешёл на Lite после 3-х лет пользования Visual Studio Code

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

Стратегии обнаружения изменений в Angular - «onPush» и «Default»

В Angular есть две стратегии обнаружения изменений — «Default» и «onPush». Рассмотрим преимущества и недостатки этих стратегий. Что такое «обнаружение изменений» в Angular? Механизм обнаружения изменений в...

7 методов оптимизации производительности React

Производительность - важнейший аспект веб-приложения. Однако одностраничные приложения React (SPA) известны плохой производительностью. Рассмотрим 7 методов, которые помогут это исправить и обеспечить беспроблемный пользовательский опыт.

Прототипирование с веб-компонентами: создание RSS Reader

Приготовьтесь отправиться в путешествие по изучению прототипирования приложения с помощью веб-компонентов, модулей es6, event target, bit cli и т. д. Вместе мы узнаем, как...

Использование хуков Git для улучшения процесса разработки

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

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

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

Как оптимизация изображений снизила “вес” главной страницы на моем веб-сайте на 62%

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

Синхронизация Git-репозиториев в режиме реального времени

Работая с клиентами на таких платформах, как Github или Gitlab, мы в Gitstart часто сталкиваемся с необходимостью синхронизировать кодовые базы между удаленными репозиториями. По...

Чистый код JavaScript: 8 простых приемов

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

Чистый код JavaScript - объекты и классы

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

Факты о веб-сайтах в 2018 году (и почему токенизация стала отличной идеей для этой...

Новый способ применения технологии блокчейна. И переход от слов к действиям с проектом uKit AI. Существование современной всемирной паутины началось почти 30 лет назад с...

Как работает маршрутизация Express

Как в приложении Node.js происходит обработка клиентских запросов? Какая функция помогает обрабатывать тот или иной запрос? Чтобы ответить на эти вопросы, заглянем в "закулисье" маршрутизации фреймворка Express.

Создание приложения для распознавания лиц с помощью Tensorflow.js

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

Чего я не знал о CSS, а стоило бы

Делать сайты я учился по-старомодному: открывал исходный код и пытался повторить то, что видел. А по тому, чего не видел (PHP/MySQL), прочёл какую-то случайно...

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

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

Создание тестового фреймворка JavaScript

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

Событийно-ориентированная разработка на основе браузерного расширения

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

Путешествие в мир анимации с Lottie-React-Native

Вы создаете умопомрачительную анимацию с помощью After Effects и намереваетесь явить ее миру. Один из способов воплотить задуманное — использовать ее в качестве экрана-заставки...

Резолвер в Angular для предвыборки данных

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

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

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

Руководство для начинающих по Git: что такое журнал изменений и как его создать

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

Service Workers и стратегии кэширования

Что такое service workers и применение стратегий кэширования Service Workers — наверняка, вы что-то об этом слышали. Что это такое? Говоря простыми словами, это сценарий, который запускается...

Введение в Веб-безопасность

Нет такого понятия, как быть защищенным от взлома на 100%. Если вам скажут обратное, то это не правда.

Лучшие способы вызова API на Javascript

При работе с JavaScript чрезвычайно важно знать, как посылать HTTP-запросы и получать динамические данные с сервера/базы данных. Узнайте о наиболее удобных способах вызова API на Javascript с помощью библиотек с открытым исходным кодом: XMLHttpRequest, Fetch и Axios.

Жизненный цикл разработки на примере сайта

Рассмотрим процесс создания сайта с точки зрения жизненного цикла разработки ПО и подробно изучим каждый из 6 его этапов.

Как работать с — настраиваемым элементом HTML с возможностью анимации

Как работать с <qr-code> — настраиваемым элементом HTML с возможностью анимации

Рассказываем и показываем, как работать с элементом для создания стилизованных, современных qr-кодов с поддержкой SVG логотипов. В конце материала — таблица сравнения с другими подобными элементами для фреймворков фронтенда.

Воссоздание графика вклада GitHub с помощью Flask и Google Sheets

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

5 ведущих веб-фреймворков 2023 года

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

1 Кодовая база - 3 платформы

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

Быстрый веб-скрейпинг с библиотекой Polars

Рассказываем, как с помощью Polars выполнить простой и быстрый веб-скрейпинг с превращением таблиц с HTML-страниц в датафреймы Polars.

Индексирование коммитов с Git Add Patch

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

5 советов о браузерных инструментах разработчика

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

Сравнение методов require() и import() в JavaScript

Методы require() и import() используются для включения модулей. У них есть несколько важных особенностей, о которых должен знать каждый разработчик.

Создание computedAsync для вычисления значений сигналов в Angular

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

Стриминг видео и чат в учебном приложении

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

Как оформить поле ввода: советы и техники

Как быстро и легко разработать поле ввода? Ответим на этот и сопутствующие вопросы доступным языком.

Как обеспечить работу современного кода JavaScript во всех браузерах

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

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

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

Состояние гонки в Node.js: практическое руководство

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

Основы JavaScript: управление DOM элементами (часть 2)

Часть 1, Часть 2 Получаем доступ к DOM элементам В данном разделе мы посмотрим на методы, которые помогут получить доступ к DOM элементам: getElementById(), getElementsByClassName(), getElementsByTagName(), querySelector()...

5 актуальных рекомендаций по оптимизации отладки

Ох, уж эти ошибки! Их появление в коде ничего, кроме досады, не вызывает. Лично мне они точно портят настроение. Только представьте: вы создаете продукт,...

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

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

Как находить уязвимости в коде на PHP?

Сегодня я наткнулся на вот этот пост Intigriti в Twitter: «Мы только что написали потрясающий фрагмент кода, но… Наша команда разработки утверждает, что он небезопасен....

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

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

Как компилировать ZXing C++ в Wasm, используя WASI SDK в Linux

WASI — это системный интерфейс, предназначенный для создания программных модулей .wasm не только для Node.js и веб-браузеров, но и для любой совместимой с WASI среды выполнения. Хотя...

Нерассказанная история: исключение Stale Element Reference в Selenium

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

Solibee: совершенно новая коллекция UI-компонентов для SolidJS

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

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

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

Безопасность Node.js в продакшене: экспертные рекомендации для разработчиков

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

GitHub Codespaces: быстрая разработка на ходу с Flutter

В прошлую пятницу мне на почту пришло приглашение попробовать бета-версию GitHub Codespaces! Я сразу же взял один из своих примерных проектов на Flutter (Fluttersaurus) и...

7 самых популярных библиотек React

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

React TypeScript: Основы и лучшие практики

Подготовка к работе create-react-app с TypeScript $ npx create-react-app your-app-name --template typescript Если вы предпочитаете Yarn, используйте следующую команду: $ yarn create react-app your-app-name --template typescript Обратите внимание, что...

Реализация ролевого управления доступом (RBAC) в Node.js и Express App

Пошаговое руководство поможет за считанные минуты внедрить и протестировать ролевое управление доступом (RBAC) в приложение Node.js и Express. Библиотека Permify позволит упростить управление разрешениями и создать устойчивую и безопасную среду приложения.

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

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

Как укорачиваются ссылки на TinyURL и Bit.ly?

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

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