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

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

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

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

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

Фреймворки для фронтенд-разработки 1. React.js С помощью React.js разработчики могут создавать повторно используемые компоненты (reusable components), каждый из которых будет со своим собственным “state”, то есть “внутренним состоянием”....

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

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

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

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

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

Говорят, что "дьявол кроется в деталях". Так почему бы не поискать его в недрах JavaScript? Совершите увлекательное путешествие в волшебное закулисье метода filter.

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

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

Разберемся, как кэшировать API-запросы с помощью Redis и NodeJS, а также как значительно сократить время отклика при запросе сетевых данных.

Автоматическая генерация сертификатов  —  на первый взгляд, нечто прямиком из мира крупных корпораций, и потому вне досягаемости обычного разработчика, который размещает контент в кластере...

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

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

Пример Прежде чем начать, рассмотрим пример того, что должно получиться в результате. Здесь можно найти библиотеку Semantic-UI-React. Этот репозиторий также доступен как пакет на NPM. С...

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

Важнейшая проблема кроссплатформенной разработки решалась в мобильных фреймворках разными способами. Первоначально проект Apache Cordova (ранее PhoneGap) решил эту проблему внедрением webview-рендеринга. Затем в проекте...

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

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

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

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

Учимся работать с датой и временем в JavaScript: разбираемся с определением и способом создания объекта Data, его методами и форматами вывода.

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

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

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

Версия Angular 7.0.0 уже вышла! Это основной релиз, который затронул всю платформу, включая ядро, Angular Material, и командную строку с синхронизированными базовыми версиями. В...

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

Или причины избегать npm и отказаться от Google Play В Kalisio мы разрабатываем геопространственное программное обеспечение с открытым исходным кодом — то есть программное обеспечение, которое управляет геолокационными...

Учиться лучше на чужих ошибках. Изучите подборку из 5 частых ошибок разработчиков  -  это лучший способ избежать их в собственной практике.

Обсуждаем, почему так важно вести логи, и разбираем популярные библиотеки, обеспечивающие эту возможность для приложений Node.js: Winston, Pino, Bunyan, Log Level и npmlog.

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

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

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

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

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

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

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

Мечтаете создать многопоточное приложение для командной игры? Читайте о том, как использовать для этого модель акторов и правильно запустить Puppeteer в Akka.js.

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

В любом языке программирования сокращения помогают написать более чистый и оптимизированный код и выполнить задачи, использовав кротчайший синтаксис. Разберём способы сокращения в JavaScript. 1. Объявление...

Карточки универсальны: они встречаются везде, от социальных сетей, таких как Instagram и Facebook, до магазинов электронной коммерции, таких как Amazon и Ebay. Макет представления...

Представляем 5 полезных, но малоизвестных библиотек JavaScript! Они помогут сэкономить силы и время при форматировании дат, обработке URL-параметров и отладке веб-страниц в мобильном терминале.

Сегодня вы узнаете два новых способа создавать переменные в JavaScript (ES6), а именно с помощью let и const. Мы разберёмся в чём разница между...

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

Представьте, что заголовок вашего профиля в Twitter сам отображает свежие статьи блога или недавних подписчиков, а вам это не стоит ни копейки. Заманчиво? Уже не терпится все рассказать!

Быстро, доступно и легко! О чем идет речь? О развертывании приложения на платформе Vercel. Поделимся успешным практическим опытом и подробными пошаговыми инструкциями.

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

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

Насколько далеко можно зайти с конфигурацией Webpack по умолчанию? Я выступал на конференции GDG Devfest, где говорил об использовании webpack в разработке современных приложений. Изначально...

Node.js был разработан Райаном Далем в 2009 году. До этого момента Райан работал разработчиком, программируя на Ruby on Rails. Базовая концепция Node.js пришла ему...

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

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

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

В отличие от TypeScript, в Go и Rust всегда известно, где возникнет ошибка. А можно ли сделать обработку ошибок в TypeScript такой же, как в Go и Rust, без использования try/catch? Предлагает простое решение.

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

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

Далее вы узнаете, как использовать библиотеку gapi для настройки аутентификации, как произвести вход пользователя, а также я покажу несколько сниппетов для обработки распространённых пользовательских...

Сперва позвольте уточнить: типизированный JavaScript — это фантастика. Я использовал Flow и продолжу использовать TypeScript в будущем, ведь это мощнейший быстро растущий инструмент. Но какова цена этой...

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

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

Хотите, чтобы на выполнение и проверку кода уходило меньше времени и сил? Ознакомьтесь с 7 правилами ESLint, рекомендуемыми для проектов TypeScript/React. Они существенно улучшат код и сэкономят ваше время.

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

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

Собираетесь работать с проектом Typescript? Не забудьте настроить для него подходящую среду!

Предыдущие части: Часть 1, Часть 2 Оптимизируем Теперь, когда мы обнаружили проблемные области, давайте посмотрим, можем ли мы сделать сервер быстрее. Лёгкий и быстрый способ Давайте вернем код слушателя server.on (вместо...

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

Я ежедневно работаю как с Angular, так и с React, а также большой поклонник Vue и Svelte и слежу за их развитием. В этой...

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

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

"Чему равно this в данном случае?" - этот вопрос часто сбивает с толку новичков в JavaScript-программировании. Предлагаем четкий алгоритм, который поможет быстро определить значение ключевого слова this.

Вы думали статистика и графики — это скука? Подумайте ещё раз… Нашумевший — это буквально самое заезженное слово в интернете, если не считать слово «буквально». Но в этот раз — это...

NPM (Node Package Manager)  —  это менеджер пакетов Node.js. Он предоставляет разработчикам широкий ассортимент полезных библиотек и инструментов. С помощью этого репозитория процесс разработки веб-проекта,...

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

Часть 1, Часть 2, Часть 3 Навигация по DOM элементам Обход DOM или, проще говоря, навигация по DOM элементам — это работа со свойствами родительских, дочерних и соседних...

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

Каждый разработчик периодически сталкивается с огромной красной строкой в консоли — Access to fetched has been blocked by CORS policy. Да, это здорово расстраивает. И хотя...

Значение this — одна из самых запутанных составляющих JavaSсript. this может принимать различные значения в зависимости от того, где располагается. В этой статье мы рассмотрим, где используется...

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

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

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

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

Часть 1, Часть 2 Значение рефакторинга Рефакторинг — это контролируемый процесс улучшения кода без написания новой функциональности. При правильном применении рефакторинг может стать мощным оружием против монстра под...

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

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

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

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

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

1. Web Bundles Этот API предоставляет возможность объединения веб-сайта в один файл. Более того, этим файлом можно поделиться через любое средство (Bluetooth или Wi-Fi Direct),...

Мало кто представлял себе, что этот язык превратится в профессиональную платформу Если ещё лет 20 назад вы бы сказали, что JavaScript станет одним из самых...

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

Redis - идеальный выбор как для хранения структур данных типа "ключ-значение", так и для кэширования. Из этого простого руководства вы узнаете, как выполнить подключение бэкенда Node.js к Redis и кэшировать данные.

Дизайнеры со всего мира часто и сами затрудняются ответить, что важнее  —  UI- или UX-дизайн. Мало кто воспринимает эти интерфейсы по отдельности и мало...

Определение Приставка “микро” в термине микросервисы является не только показателем размера сервиса. При переходе на архитектуру микросервисов команды стремятся повысить свою подвижность, а именно получить...

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

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

Предлагаем пошаговое руководство по интеграции Django с материализованными представлениями PostgreSQL. Вы узнаете, как настроить ORM Django на полную поддержку материализованных представлений с возможностью создавать и обновлять материализованные представления с помощью системы миграции Django.

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