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

Как читать и понимать документацию API

Если, получив совет “почитать документацию API”, вы так и сделали, но так толком и не поняли, что в ней к чему, то эта статья...

Создание приложения Flask на Python для визуализации мест путешествий

Воспоминания о местах путешествий можно хранить не только в сердце, но и на пользовательской карте HERE с прикрепленными на ней фотографиями. Для ее создания воспользуемся Python, API HERE maps, Flask и Heroku.

Zod — гарант безопасности кода TypeScript

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

Мы снова написали самый быстрый JS-фреймворк UI

Я выработал четкий алгоритм, который применяю практически ко всем видам возникающих передо мной задач. Шаг 1. Определить задачу. Этот этап нередко оказывается самым длительным, потому что...

Все, что нужно знать о SASS

Что такое SASS и зачем его осваивать? Какие в SASS функциональные возможности, для чего здесь файлы «Partials» и какие есть инструменты для компиляции?

Как с нуля создать проект на React, используя Webpack 4 и Babel

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

Лучшие JavaScript-фреймворки и тенденции веб-разработки в 2021 году

В прошлом году весь мир сильно пострадал от пандемии COVID-19. Этим беспрецедентным кризисом до сих пор охвачены абсолютно все сферы человеческой деятельности. Негативные последствия...

Переключатель темного режима в веб-приложении

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

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

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

5 типичных ошибок веб-разработчиков

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

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

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

Почему я больше не пользуюсь D3.js

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

Топ-5 новых функций JavaScript ES12, которые облегчат вам жизнь

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

8 паттернов реактивности в современном JavaScript

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

Прототипирование для Vue

С июля 2019 года Vue занимает третье место по количеству звезд на Github. Он опережает React более чем на 10 000 звезд и оставляет...

Как создать библиотеку компонентов для совместного использования

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

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

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

Отзывчивость – это очень просто с CSS-переменными

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

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

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

Как работает Supabase — альтернатива облачной платформе Firebase

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

Сказание о шаблоне Стратегия и его реализации

Я, конечно же, не Майкл Фелпс, да и плавать больше предпочитаю в море, но мне очень нравится наблюдать за тренировками пловцов. Этот процесс словно...

5 практик, которые облегчат работу с Next.js 14

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

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

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

Rust: работа с потоками

Жил я себе поживал раньше без забот и без хлопот в однопоточной счастливой стране JavaScript, где имел дело с потоками разве что при взаимодействии...

Расширение Chrome для поиска акций на eToro с помощью скринера акций FINVIZ

Больше не нужно переключать вкладки, чтобы узнать, есть ли конкретная акция на eToro. Представляем вашему вниманию расширение, которое сделает эту работу за вас!

Отмена действий в Git

Мы всегда готовы подчеркивать бесчисленные возможности, которые предлагает Git, и эта статья не станет исключением. Git известен своей потрясающей способностью отменять практически любые действия!...

Как разработать систему для 100 миллионов пользователей: руководство для начинающих

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

PHP: введение и настройка среды

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

Создание базовой чат-системы с использованием node.js и socket.io

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

Психология цвета в UX

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

Утилиты, которые повышают эффективность приложения React на Typescript

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

Об Apache Spark - интересно и со вкусом!

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

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

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

Что значит this в JavaSсript?

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

11 сверхполезных советов для JavaScript разработки

1. Преобразование в Boolean с помощью оператора !! Иногда нам необходимо проверить существование переменной или наличие у нее верного значения. Для подобной проверки вы можете использовать !!...

Фрагменты в React

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

Конец эпохи виртуального DOM (React)

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

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

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

Как развернуть веб-приложение Streamlit в сети: три простых способа

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

Как увеличить производительность CSS-in-JS в 175 раз

Мне нравится удобство CSS-in-JS, особенно возможность совместного расположения стилей, но в некоторых деталях я не уверен: В том, что обязательно нужно использовать хешированные классы вместо...

Python и веб-разработка: краткое руководство

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

Как написать красивый и информативный README.md

Многие программисты лихо управляются с кодом и знают мельчайшие подробности своих проектов. Но некоторым из них (в том числе и мне) недостаёт коммуникативных навыков. Удивительное...

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

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

Как создавать доступные веб-приложения для дальтоников с помощью Chrome DevTools

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

Парсинг HTML из строки на Ruby On Rails

На одном из этапов моего проекта в школе программирования Flatiron Bootcamp мне пришлось столкнулся с проблемой, совершенно отличающейся от того, что я видел раньше....

Как оптимизировать настройку приложений React Native

Собственный CLI делает настройку приложений React Native быстрее и удобнее. Узнайте о том, как создать интерфейс командной строки с помощью Node.js, а также упаковать проект и опубликовать его на npm.

9 UI-библиотек веб-компонентов, которые пригодятся в 2019 году

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

Сможет ли Vue.js превзойти React в 2020 году?

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

Запуск DBT в Azure Functions с помощью Snowflake

Практики DataOps очень быстро встают на вооружение в компаниях, работающих с данными, особенно в тех, которые переходят на Cloud Data Warehouses (облачные хранилища данных)....

Разработка и развёртывание приложения машинного обучения: полное руководство

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

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

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

eCommerce UI/UX дизайн: карточка товара в примерах

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

Компоненты Wrapper в Vue 2.6 и Vue 3.0

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

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

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

Миграция REST API на GraphQL

GraphQL появился относительно недавно, а значит, разработчики API не уверены, писать следующий API на GraphQL или нет. Очевидно, что REST API хорошо знаком программистам...

Как сжимать коммиты в Git с помощью git squash

Для начала давайте разберемся: что же это вообще такое — git squash. Git squash — это прием, который помогает взять серию коммитов и уплотнить ее. Например, предположим: у вас...

Супергеройский макет: комбинируем CSS-сетки и CSS-фигуры

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

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

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

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

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

Можно ли использовать бессерверные технологии для создания микросервисов?

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

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

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

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

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

6 супер команд терминала, или как стать мастером продуктивности

Пройдитесь по /usr/bin большинства систем Linux или macOS, и вы найдете сотни, если не тысячи, предлагаемых команд. Количество доступных опций кому угодно вскружит голову....

Подробнее о JSON RPC

Не хочу разводить очередной холивар на эту тему. Поэтому, если вкратце, то GraphQL — это сложно, RPC — быстро, REST — некий медиум, но не хватает batch-запросов. И если у...

Конфигурация файла PHP.INI

Файл конфигурации php.ini является прямым методом влияния на функциональность PHP. Расскажем о его важных настройках, которые могут понадобиться для парсера PHP.

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

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

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

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

Нововведения в Apache Airflow 2.0: смогут ли они удовлетворить текущие потребности инженерии данных

Преимущества Airflow 2.0 по сравнению с предыдущими версиями Пользовательский интерфейс Интерфейс Airflow 2.0 выглядит свежим и современным по сравнению с предыдущими версиями. Его основное преимущество заключается...

Осваиваем NestJS: построение эффективного бэкенда REST API

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

6 интересных веб-технологий в 2019 году

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

Плюсы и минусы React: виртуальная DOM, синтаксис JSX и другие аргументы для спора

Рассмотрим важные достоинства и недостатки React, чтобы с умом выбирать JavaScript-фреймворк и аргументированно отстаивать свой выбор.

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

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

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

Мастерское владение Docker гарантирует фронтенд-разработчику массу выгодных преимуществ. Начнем с освоения 10 важнейших команд Docker и откроем новые горизонты профессии.

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

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

Разработка веб-дэшбордов с использованием React, Material UI, Tailwind CSS и Nivo. Часть 1

Представляем вашему вниманию серию статей, посвященных визуализации и ее применению в современном IT-ландшафте. В первой части цикла расскажем, как создать динамичное и отзывчивое приложение с использованием React, Material UI, Tailwind CSS и Nivo.

Заменит ли аутентификация по лицу традиционную систему веб-аутентификации

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

Введение в сетки в цифровом дизайне

Возможно, после открытия дизайнерской программы у вас возникнут вопросы: «С чего начать?» и «Куда поместить заголовок?». Ответ очень прост: начинать работу стоит с создания...

Отображение нативных всплывающих окон с помощью API уведомлений JavaScript

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

Повышение дизайнерских навыков: советы и упражнения

Четыре года назад я бросила работу в детской поликлинике и начала свое путешествие в мире дизайна. Я читала книги по UX по дороге на...

Завершаем настройку мощного API на Nodejs, GraphQL, MongoDB, Hapi, и Swagger. Часть 2

Это вторая часть в серии, где мы строим мощный API GraphQL. Пожалуйста, посмотрите первую часть нашей статьи,если вы до сих пор этого не сделали. Я знаю,...

SonarQube: за качество кода отвечаем

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

Разделение кода в Next JS

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

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

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

Знакомство с ReactJS на базовом уровне

Что такое ReactJS? ReactJS очень популярный в среде веб-разработчиков инструмент. Что же он собой представляет? ReactJS — библиотека JavaScript, разработанная Facebook для создания пользовательских интерфейсов. С ее помощью разрабатываются...

ТОП-25 библиотек React 2021–2022: новые, полезные, но малоизвестные пакеты JavaScript

React Content Loader, React Filepond, React Select, React Query, React Hook Form, React Infinite Scroller и другие библиотеки JavaScript

Подробно о перечислениях в Typescript

Углубимся в тему перечислений в TypeScript и рассмотрим их в рабочей среде React: виды, особенности, случаи применения.

Три примера, когда не стоит использовать стрелочные функции JavaScript

Стрелочные функции ES6 Вы их знаете, любите и наверняка постоянно используете! Представленные в 2015 году как часть обновления ECMAScript 6 стрелочные функции приобрели свою популярность совершенно...

11 исходных программ JavaScript, предоставляющих шаблоны проектирования

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

5 увлекательных игр для изучения основных концепций CSS

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

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

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

7 полезных репозиториев GitHub для JS-программистов

Репозитории GitHub - лучший способ изучать программирование (конечно, после чтения документации). Представляем подборку из 7 репозиториев, которые помогут улучшить знания JavaScript.

Создание приложения для отслеживания фильмов с помощью HTML, CSS и JavaScript

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

Компоненты высшего порядка в React

Что такое компоненты и функции высшего порядка и в чем заключаются их преимущества? Представляем вам комплексное руководство по компонентам высшего порядка в React.

Geist UI: Утонченная эстетика UI в React

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

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

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

Тест-драйв Solara для разработки веб-приложений на Python

Протестируем возможности фреймворка Solara в процессе создания приложения-планировщика на Python. Выявим его достоинства и недостатки и сравним со Streamlit.

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

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

PHP: строки

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

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

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

Оптимизация размера Angular bundle за 4 шага

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

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