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

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

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

Одна из наиболее противоречивых тем во фронтенд-разработке — это микрофронтенды. Заслуживают ли они внимания? Стоит ли на самом деле разделять приложение? Нужны ли они вам уже...

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

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

Согласно определению из "CSS: The Definitive Guide" Эрика Майера (Eric Meyer) и Эстеля Вейля (Estelle Weyl): С помощью (псевдо) селекторов можно назначать стили так называемым...

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

Загрязнение ngOnInit ngOnInit - один из самых важных хуков жизненного цикла в компонентах Angular. Он используется для инициализации данных, настройки слушателей, создания соединений и т.д....

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

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

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

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

Один из самых частых вопросов, которые я слышу от своих учеников, звучит так: "Почему вы преподаете нам Node.js, а не PHP?" Ответ "Поверьте, я...

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

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

Собеседования c разработчиками напоминают Дикий Запад. Никто толком не понимает, чем занимается. Большинство технических рекрутеров не могут отличить Java от JavaScript. Тем не...

Язык Java в настоящее временя участвует в функционировании 134 861 сайта, включая ESPN, SnapDeal, Alibaba и т.д. За всю историю существования этот язык доказал...

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

API discord предоставляет инструмент для создания и использования ботов. Рассмотрим пример создания базового музыкального бота и добавления его на сервер. Бот сможет проигрывать, пропускать...

Этот список составлен на основе книги "101 UX-принцип" (101 UX Principles), написанной Уиллом Грантом (Will Grant). 1. Пустые состояния Пустые состояния должны представлять нечто большее, чем...

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

Декораторы - это объекты, которые используются для динамического добавления дополнительной функциональности к другому объекту без изменения реализации этого объекта. Пример использования: @filterMales // Это декоратор class MyClass...

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

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

VSCode — один из лучших редакторов кода на сегодняшний день. Тем не менее удобство и эффективность во многом обеспечивают именно расширения для редактора. Для VSCode существуют сотни...

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

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

1. Микрофронтенды Звучит иронично, но несмотря на то, что фронтенд-разработка обладает модульными преимуществами компонентов, она все еще более монолитна, чем бэкенд-микросервисы. Микрофронтенды предоставляют возможность разделения фронтенд-архитектуры...

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

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

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

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

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

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

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

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

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

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

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

В данной статье я постараюсь объяснить новые возможности ES6 JavaScript с точки зрения объектно-ориентированной парадигмы. Для начала, Что такое парадигма программирования? Парадигма — это пример или модель чего-то. То...

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

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

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

Throttling и debouncing — это широко используемые техники для увеличения производительности кода, который выполняется повторно с некоторой периодичностью. Давайте разберёмся, как лучше их применять, чтобы ускорить работу...

Предыдущие части: Часть 1 В предыдущей статье я рассказывал о том, как извлекать статические данные с помощью Node.js. В настоящее время сайты приобретают более динамический характер,...

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

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

Вы когда-нибудь замечали, что на собеседованиях задают одни и те же клишированные вопросы? Уверен, вы поняли, что я имею ввиду. Ну вот, к примеру: Кем вы видите...

Стандартный Apple Notes, более продвинутый Google Docs, Microsoft Word и Medium — всё это редакторы, которые позволяют фиксировать наши важные мысли и информацию, тем самым помогая...

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

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

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

В этом посте я проведу вас по пути создания приложения Next.js, обслуживаемого клиентским сервером Express c применением фреймворка Typescript. Полную версию проекта можно увидеть...

Далее я убуду использовать названия Sassy, Sass и SCSS, поэтому давайте определимся, так как концептуально разница не велика, будем считать, что это одно и...

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

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

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

Внимание: с этой статьёй вы не освоите Rust, зато сможете быстро разобраться и приступить к работе с WASM, используя замечательный инструментарий wasm-pack и интуитивно...

Я недавно узнал о репозитории с полезным контентом (что для меня самое важное) и решил углубиться в тему, составив список репозиториев GitHub, которые принесут...

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

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

Недавно мир приложений разделился на две категории: появились приложения для устройств Android и iOS. Возможно, многие слышали о прогрессивных веб-приложениях (PWA), однако не знакомы...

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

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

Что такое Webpack? Webpack — это инструмент, позволяющий скомпилировать, например, JavaScript модули в единый JS-файл. Webpack также известен как сборщик модулей. При большом количестве файлов он создает один объемный файл...

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

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

Недавно я начал изучать React и для создания проектов я использовал create-react-app, чтобы быстро и без особых усилий добиться желаемого результата. Я подозреваю, что...

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

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

С каждым днем новые технологии сокращают разрыв между вебом и нативными приложениями. Один из таких примеров  —  прогрессивные веб-приложения, которые добавили в Интернет множество...

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

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

1. Глобальная и локальная загрузка компонентов Vue.js предоставляет два способа загрузки компонентов: глобально на экземпляре Vue и на уровне компонентов. Каждый метод обладает своими преимуществами. При...

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

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

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

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

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

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

Привносим фулстек в JAMstack Несколько дней назад я просматривал Hacker News и наткнулся на интересный пост под названием “Redwood: интегрированный фулстек JavaScript веб-фреймворк для JAMstack.” В...

В этом руководстве приведены шаги, необходимые для создания кроссплатформенного приложения для Android с использованием Python-фреймворка Kivy и Linux Ubuntu. Перед началом установки и запуском...

На днях я баловался с темной версией в новой версии MacOS Mojave. Мои глаза не на 100% рады, но это особенно полезно, когда залипаешь...

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

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

Когда я только начал работать с React Native (RN), у меня никогда не доходили руки до изучения анимации. Многие вещи казались важнее, поэтому я...

Большинство компонентов версионируются как часть проекта (например, component-library), что противоречит концепции создания модульных UI-приложений. Например, чтобы использовать слайдер-компонент, нужно внедрить в приложение полную библиотеку...

Мы будем создавать приложение ToDo с помощью библиотеки Electron. Мы затронем следующие темы: хранение данных, использование нескольких окон, взаимодействие между браузерами. Что необходимо для этого Я...

Объект window — глобальный объект, обладающий свойствами, относящимися к текущему документу DOM — тому, что находится во вкладке браузера.  Он включает в себя конструкторы, значения свойств и методы для...

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

Vue JS, созданный Эваном Ю и членами сообщества, представляет собой прогрессивный фреймворк для создания пользовательских интерфейсов. Он состоит из открытой базовой библиотеки, ориентированной на...

Каждый знает хотя бы один вид цикла for. Это классика, и они есть почти в каждом языке. В JavaScript есть три вида циклов (или...

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

Мы, как разработчики, живем среди CLI-инструментов. От gitдо cloud shells — этими средствами мы пользуемся повсеместно. И настала пора научиться создавать свои собственные. В процессе работы...

В этой статье мы рассмотрим компоненты высшего порядка (Higher-Order Components, HOC) в React. Что такое HOC? HOC — это особая техника в React, при которой функция принимает аргумент Component...

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

Предыдущие статьи: Часть 1, Часть 2, Часть 3 Каррированием называется метод, при котором мы вызываем функцию с меньшим количеством аргументов. Но функция эта возвращает значения...

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

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

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