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

8 полезных приемов в CSS: Эффект параллакса, прилипающий футер и многое другое

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

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

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

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

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

Топ-10 антипаттернов при использовании микросервисов

Разделение на микросервисы доказало свою эффективность в практике программирования. Но всегда ли они работают так, как ожидается? Рассмотрим 10 антипаттернов при использовании микросервисов и способы их избежания.

21 лайфхак для новичков в JavaScript

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

Шаблон “Декоратор” в разработке на TypeScript

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

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

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

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

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

Создаем на JavaScript приложение записи заметок в реальном времени

Подробная инструкция, включая настройку аутентификации, реализацию real-time обновления приложения при внесении изменений в БД и процесс авторизации через Google-аккаунт.

Автоматизация создания стикеров с помощью веб-скрейпинга и обработки изображений в Python

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

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

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

Обнаружение компонентов с Bit ✨

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

Внутренняя жизнь React Native

React Native — это библиотека JavaScript для создания мобильных приложений, работающих как на Android, так и на iOS. Как говорят создатели: “Научитесь однажды — ...

Экспорт данных в Excel с React

В React есть два способа реализации функции экспорта: с помощью любой сторонней библиотеки или с помощью создания компонента. Рассмотрим оба способа ниже. Пример проекта Возьмем простое...

6 лайфхаков для улучшения кода JavaScript

Хотите продвинуться в изучении JavaScript? Возьмите на вооружение эти лайфхаки для оптимизации кода!

Wasp — DSL-язык для современных веб-приложений

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

3 альтернативы инструкции Switch в Typescript

Если вас смущает громоздкость инструкции switch, то стоит познакомиться с 3 альтернативными вариантами, доступными в TypeScript: объектные литералы, полиморфизм и обобщения.

Переход с Webpack на Rspack

Подумываете о переходе с Webpack на Rspack? Настоятельно рекомендуем попробовать! Только сначала изучите опыт тех, кто это уже сделал. Вас впечатлит как повышение производительности разработки, так и удобство сопровождения проекта при переходе на Rspack.

Напишите свой первый микросервис на JavaScript

Предлагаем пошаговую инструкцию по разработке простого микросервиса на основе API с использованием JavaScript, NodeJS и контейнеризации с помощью docker.

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

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

7 React-проектов, которые помогут вам стать лучшим разработчиком

Хотите расширить свое портфолио и основательно изучить ReactJS? Эти 7 React-проектов идеально подходят для развития навыков веб-разработки. Они помогут вам создавать интерактивные сайты и приложения на высоком профессиональном уровне.

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

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

Руководство разработчика по оптимизации скорости работы веб-сайтов

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

Параллельный режим React - взгляд в будущее

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

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

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

4 недооцененных API браузера

Познакомимся с 4 полезными API браузера, которые лучше всегда держать под рукой : Battery API, IndexedDB API, Clipboard API и Page Visibility API.

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

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

В чём разница между var, let и const в JavaScript

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

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

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

Создаем приложение React с нуля в 2021 году

➡️ Весь сопутствующий материал доступен на GitHub. Замысел проекта Задачей этого руководства было не идти проторенным путем “волшебных” готовых шаблонов (например create-react-app и react-boilerplate), а самостоятельно...

Настройка проекта TypeScript с помощью ESLint, Prettier и VS Code

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

Интуитивно понятное объяснение конструкции Async/await в JavaScript

Как избежать "ада обратных вызовов"? Всегда ли полезны промисы? В чем сила синтаксической конструкции Async/await? Ответим на эти вопросы и научимся проектировать мощные асинхронные конвейеры для эффективной обработки данных.

Интерфейсы с вкладками без JavaScript

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

9 инструментов CSS

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

Светлый и темный режимы в веб-приложениях React на основе CSS Tailwind

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

Введение в Page Visibility API

Познакомимся с Page Visibility API, рассмотрим его назначение, принцип работы, область применения и практические примеры.

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

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

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

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

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

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

Чистый код JavaScript — Вертикальное форматирование

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

Комплексная разработка веб-приложений с помощью React и Node.js

Хотите создавать быстрые сайты? Предлагаем эффективный способ комплексной разработки с помощью "волшебного тандема" React и Node.js.

Топ-5 способов стилизации React-приложений в 2024 году

Использование библиотек для стилизации React-приложения может сэкономить много времени. Изучите возможности лучших из них: StyleX, Styled Components, Sass, Tailwind и Emotion. Алгоритмы реализации и демо-версии каждой библиотеки значительно облегчат работу.

Создание компонента Timer с React и Bit

Рассмотрим пример создания компонента countdown timer в React с использованием Bit. В результате компоненты будут выглядеть следующим образом. Помимо этого, мы научимся обмениваться компонентами и использовать...

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

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

Двоичное дерево поиска: вставка значения с использованием JavaScript

Двоичное дерево — это древовидная структура данных, в которой каждый элемент имеет не более 2 дочерних элементов. Эта структура данных состоит из трех основных элементов: 1. Данные 2....

Развертывание фронтенда и бэкенда приложения на Kubernetes

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

Создание клона Google Maps с открытым исходным кодом. Часть 1

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

Сайты с модальными диалоговыми окнами без JavaScript

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

Как загружать изображения в RAILS API и возвращать их обратно

Мне потребовалась неделя, чтобы написать back-end основу для Supagram при помощи Rails API. Supagram — это легкий браузерный клон Instagram, в котором есть те же посты,...

Сравниваем WebGL-фреймворки Three.js и Babylon.js

В чем их основное отличие, какой их этих инструментов легче в освоении, а какой более лаконичен и понятен в коде? Знакомимся с обоими на примерах.

Практичные Canary-релизы в Kubernetes с Argo Rollouts

Основанная на микросервисах инфраструктура Soluto, совмещенная со всеми инструментами CI/CD, позволяет осуществлять по несколько релизов в день, предоставляя пользователям новые возможности и внося исправления. При...

Настройка современной среды разработки в Windows 10

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

Рандомизатор на чистом CSS

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

3D-формат в профессии дизайнера продукта

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

9 убийственных приемов для JavaScript разработчиков в 2019 году

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

Наскучил JavaScript? Достойная альтернатива - Mint

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

Кнопка sign-in для вашего веб-приложения

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

Уменьшаем размер образа Docker для приложения Next.js

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

Новый взгляд на старые истины: принцип «Не повторяйся!» (DRY)

Первый принцип, с которым вы знакомитесь, начиная свой путь в мир разработок ПО и записывая первые строки кода, — это постулат DRY (“Не повторяйся”). А как...

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

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

10 вещей, которые надо знать, чтобы стать мастером JavaScript

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

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

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

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

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

Как агентный ИИ изменит Angular-разработку в 2026 году

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

Плюсы и минусы Deno

Краткий обзор достоинств и недостатков новой среды выполнения Deno, а также ее сравнение со всем известной и привычной средой Node.

27 важных однострочных функций JavaScript, используемых разработчиками ежедневно

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

Создание чат-приложения в режиме реального времени с Vue.js, Socket.IO и Node.js

В статье я расскажу, как можно создать чат-приложение в режиме реального времени с помощью Vue.js, Node.js, Express и SOCKET.IO. Вот скриншот того, что должно получиться: PS:...

Сравниваем различные способы выполнения HTTP-запросов в JavaScript

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

8 пунктов по стилю React + TypeScript

Ценность этих рекомендаций в их практическом значении. Добавьте их в собственное руководство по стилю React + TypeScript, и ваш код станет чище и понятнее.

Взгляд на RedwoodJS

Обзор веб-фреймворка Redwood: Rails в мире React, авторы которого верят, что удобство начинается со стандартизации. Что из себя представляет этот фреймворк? Читайте ответы ниже.

Реализация VR-пространства в браузере

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

6 продвинутых способов создать чистый код на TypeScript

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

Веб-скрапинг с помощью Node.js — Часть 1

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

Обзор JavaScript на основе диалога с ChatGPT

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

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

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

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

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

10 ключевых функций массивов JavaScript

Умение эффективно работать массивами в JavaScript - одно из отличий профессионала от новичка. Изучите 10 основных методов массивов, чтобы подняться на новый уровень веб-разработки: создавать более понятный, эффективный и гибкий код, который позволит работать с данными без особых усилий.

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

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

Лучшие практики JavaScript — производительность

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

6 актуальных советов по созданию чистого кода React

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

Интеграция ChatGPT с Node.js: руководство для начинающих

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

Индексация строк в Rust и TypeScript в сравнениях

Сравнительный анализ обработки строк в Rust и TypeScript. Примеры и пища для размышлений гарантированы!

Django-приложение для ведения личного дневника

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

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

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

Используйте эти хаки для трехкратного ускорения скриптов JavaScript уже сегодня

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

Основные языки веб-разработки

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

Как использовать Claude Code в разработке бэкенда?

Claude Code — это мощный агент-помощник для бэкенд-разработки на Java. Он генерирует REST-эндпоинты, пишет тесты, рефакторит код и отлаживает ошибки. Разберем команды, настройку CLAUDE.md и реальные примеры для Spring Boot.

7 ошибок, которые разрушают фронтенд-макет

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

HTML: полное руководство по заверстыванию текста вокруг изображения

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

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

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

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

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

Применение пустого пространства в UI-дизайне

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

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

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

Осторожно! Angular крадет ваше время

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

Как анимировать 3D-модель с помощью PyWeb3D

Погрузимся в мир анимации и создадим анимированный клип с 3D-моделью с помощью pyWeb3D.

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

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

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

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

70% интервьюеров задают эти 5 вопросов по React.js

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

Возможности автозаполнения для веб-разработчиков

Разберем понятия автозаполнения/автодополнения и узнаем, как браузеры автоматически заполняют стандартные поля, кредитные карты, адреса и пароли на примере Chrome.

29 инструментов и сайтов для дизайнера, о которых вы никогда не слышали

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

1...101112...14 Страница 11 из 14

Почему стоит использовать Pathlib в качестве альтернативы модуля OS

Применять модуль OS при работе с Python не совсем удобно. Сегодня расскажем о преимуществах библиотеки Pathlib, которая может стать достойной заменой этого компонента.

Разработка игр для малышей: больше пользы, меньше разочарования

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

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