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

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

GitHub

Официальный CLI GitHub

GitHub — самый известный провайдер Git хостинга долгие годы существовал, не имея официального инструмента CLI (интерфейс командной строки). Это весьма удивительно, учитывая, что сам...
JavaScript

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

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

Спасение жизней с помощью Scrum

Историки могут пересмотреть прогресс человечества и обозначить чёткую линию между временем “до появления Scrum” и “после появления Scrum”. Это...
Feature Branches

Вам больше не нужны ветви для фич…

Что такое магистральная разработка? Магистральная разработка (Trunk Based Development - TBD) - процесс разработки ПО. Согласно trunkbaseddevelopment.com (отличный источник...
React TypeScript

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

Подготовка к работе create-react-app с TypeScript $ npx create-react-app your-app-name --template typescript
GitHub

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

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

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

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

Настройте удалённую разработку с VS Code в браузере

В этом руководстве я расскажу о настройке VS Code Server с DigitalOcean и попутно поведаю о приёмах, которые использовал для создания простого...
JavaScript

Представляем объект JS Window - видимость и дочерние элементы

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

Репозитории GitHub в помощь каждому веб-разработчику

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

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

Ограничение доступа к переменным и свойствам Задача состоит в том, чтобы сократить время доступа к переменным и свойствам...
Java Script

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

Приложения становятся все сложнее, и нам нужен способ разделять код на управляемые фрагменты. Веб-компоненты подойдут для создания компонентов, которые можно неоднократно использовать. 
Web Server

Веб-сервер с нуля в TypeScript и Node

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

Лучшие практики JavaScript: переменные

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

Установка Next.js с использованием клиентского сервера Express и TypeScript

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

10 API консольных утилит Chrome

1. monitor Используется для мониторинга функции: function traceFunc (arg) { }
Virtual DOM

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

Самый популярный на сегодняшний день преемник устраняет пробел, созданный его предшественником. Чтобы разобраться в изменчивой структуре фреймворков, заглянем...
Java Script

Почему мы не используем лучшие практики CI/CD

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

Хватит везде использовать ===

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

Понятие о миграциях в TypeORM

Миграция в TypeORM — это единый файл с SQL-запросами для обновления схемы базы данных. Об этом важно знать администратору базы данных, бекэнд-инженеру или техлиду,...
Java Script

Лучшие практики JavaScript: объекты

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

10 отличных JavaScript библиотек на 2020 год

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

Версионирование независимых UI-компонентов

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

Смертоносные интерфейсы

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

Фильтруем баги. Как реализовать тестовое покрытие в TypeScript под Node.js с помощью Jest

Я обожаю писать программы. Да что уж там: я не могу представить себя, занимающимся чем-то другим. Шутки шутками, но есть у меня...
Back End

У приложений будущего может не быть бэкенда

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

Кто придет на замену JavaScript

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

Почему не стоит использовать объекты в роли карт в JavaScript?

До появления ES6 при создании карты или словаря хранение ключей и значений мы зачастую реализовывали посредством объектов. В таком способе есть свои...
Java Script

Не стоит частить с if в JavaScript

Мне нравится воспринимать логику построения условий как хлеб и масло в среде разработки софта. Она позволяет разработчикам создавать интересные, полезные и веселые...
Type Script

Замечательные новые фичи TypeScript 3.5

Новые фичи включают в себя:  увеличение скорости для поэтапных сборок; вспомогательный тип Omit;улучшенные проверки избыточных свойств в типах объединения;вывод типов...
API Chrome

API Chrome: 7 новинок

1. Web Bundles Этот API предоставляет возможность объединения веб-сайта в один файл. Более...
PWA

Превращаем веб-сайт в PWA

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

Компоновщик в JavaScript

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

Шаблон Медиатор в JavaScript

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

Как исправить ошибки сертификатов в Node-приложениях при работе с SSL

Если вам уже доводилось писать приложения на Node/Express, то вы не понаслышке знаете, что такие приложения обычно устанавливаются с HTTPS и сертификатом...
Java Script

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

Если вы не совсем в курсе современных тенденций JavaScript, то, по крайней мере, слышали о промисах ранее, но не знаете, где и...
Java Script

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

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

11 главных фронтенд-трендов на 2020 год

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

Избегайте 5 антипаттернов, работая с коллекциями в JavaScript

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

Не используйте for при переборе массивов

Циклы for имеют для меня особое значение. Довольно продолжительное время я активно их использовал, пытаясь уйти от циклов while. При этом неизбежно...
React

Первые шаги в анимации React Native

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

Потоки и буферы в Node.js

Для управления потоковыми данными наподобие видео или большого файла в Node.js реализован отдельный потоковый модуль. В текущей статье мы...
Java Script

JavaScript: как удалить значения из массива

Четыре нативных способа удаления значений массива Массивом называется упорядоченный тип данных, хранящий несколько значений. Это означает, что каждый элемент в...
Angular

Объединение Google API с Angular

💡Мотивация Задача: нужно получить доступ или отобразить события частного google-календаря.Проблема: нельзя поместить частный календарь внутрь iframe или запросить...
Design System

7 инструментов для создания дизайн-систем в 2020 году

Легенда гласит, что первая дизайн-система была представлена НАСА в 1976 году. С тех пор дизайн-системы превратились в широко распространенную практику, используемую для...
Java Script

Зачем нужен Strict Mode в JavaScript?

Строгий режим — это важная часть современного JavaScript. Он позволяет использовать ограниченный синтаксис JavaScript. Семантика строгого режима отличается от старого “неаккуратного...
VsCode

10 рекомендаций по ускорению рабочего процесса в Visual Studio Code

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

Как создать GraphQL-сервер с запросами, мутациями и подписками

Если вы ещё не знакомы с TypeScript — не беда. Продолжайте читать дальше: основные понятия и большую часть синтаксиса освоить будет несложно.
React

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

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

Функциональное программирование в JavaScript: руководство с практическими примерами

Функциональное программирование (ФП) — это стремительно набирающий популярность стиль написания кода. Есть много материалов о концепциях ФП, но мало — о том, как применять их на...
Swift

Понимание врапперов в Swift

Наряду со многими новыми функциями, которые появились в Swift 5.1, одна из самых интересных —  это врапперы свойств. По сути врапперы находятся между...
Node & Java Script

7 бесплатных Node пакетов с открытым исходным кодом

Вся основная сила Javascript заключается в бесчисленном множестве потрясающих пакетов, находящихся в открытом доступе. Главное, не забывать хотя бы иногда благодарить их...
Serverless Functions & Microservices

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

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

Топ - 9 фреймворков Java в 2020 году

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

Как предотвратить состояние гонки с помощью React Context API

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

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

Часть 1, Часть 2 Напомним, что в части 1 мы дали немного вводной информации о языке запросов GraphQL, о...
GraphQL

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

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

7 моих любимых расширений VS Code

Расширения для VS Code Я, как и многие другие, люблю настраивать VS Code под себя. Я постоянно ищу новые...
PHP

Погружение в unserialize(): больше, чем RCE

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

Эффективное использование ESLint

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

Ember.js или Vue.js: какой фреймворк выбрать?

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

Отладка с Git

В этой статье мы рассмотрим два метода Git для отладки ошибок в базе кода - blame и bisect. С помощью Git blame описываются...
JavaScript

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

Часть 1, Часть 2, Часть 3, Часть 4 Изменения в DOM Давайте теперь рассмотрим, как добавлять,...
PHP

Ключевое слово static в PHP

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

Советы по анимации с CSS и JavaScript

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

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

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

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

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

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

В этой статье мы рассмотрим компоненты высшего порядка (Higher-Order Components, HOC) в React. Что такое HOC?
Java Script

Увеличиваем производительность приложения React + Redux с библиотекой Reselect

Селекторы — это очень простой способ выбрать состояние из хранилища redux, которое содержит всю логику и данные приложения. Если вы создаёте...
JavaScript

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

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

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

Часть 1, Часть 2 Получаем доступ к DOM элементам В данном разделе мы посмотрим на методы,...
JavaScript

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

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

10 правил программирования NASA

10 правил, призванных облегчить проведение контроля и статического анализа кода. Вот что об этих правилах говорят в NASA:
Vuejs

Переключение между табличным и списковым представлением в Vue.js

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

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

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

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

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

Повесть об однонаправленном потоке данных в Angular

У Angular есть свои фишки и причуды. В то время как React реализует модель однонаправленного потока данных по умолчанию, Angular с самого...
Ruby on Rails

Создаем функции поиска и фильтрации в Ruby on Rails

Ruby on Rails замечательно подходит для создания мощного и гибкого бэкенда. Однако из-за популярности и гибкости JavaScript, Ruby используется для фронтэнда не...
Vue.js 3

Vue.js 3: программирование, ориентированное на будущее

Если вы используете Vue.js, то знаете, что версия 3.X будет выпущена в ближайшее время. На данный момент новая версия находится в активной...
JavaScript

Оператор Spread и деструктуризация в JavaScript: практическое руководство

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

Как работает JavaScript

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

Платформы Аngular в деталях. Часть 4. Визуализация Angular-приложений в терминале

Часть 1, Часть 2, Часть 3, Часть 4 В этой статье, последней из серии статей «Платформы Angular в деталях»,...
Angular

Платформы Аngular в деталях. Часть 3. Визуализация Angular-приложений в терминале

Часть 1, Часть 2, Часть 3 В этой статье мы с вами приступим к процессу создания пользовательской платформы....
Angular

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

Часть 1, Часть 2 Фреймворк Angular был задуман платформенно-независимым. Такой подход позволяет запускать Angular-приложения в разных средах: в браузере,...
Angular

Платформы Angular в деталях. Часть 1. Что такое платформы Angular?

Инфраструктура для разработки приложений Angular была задумана как платформенно-независимая технология (далее по тексту — фреймворк). Такой подход позволяет запускать приложения на Angular в разных...
Component Library

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

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

Layout для Material-UI

Material-UI — одна из самых популярных библиотек компонентов react. Однако невозможно найти ни одной инструкции или статьи о том, как создать layout на...
React

React Native vs Flutter

Сегодня в мире насчитывается порядка 2,5 миллиардов пользователей смартфонов, и их количество только растёт. Смартфоны используют для разных целей, начиная от установки...
Angular

Переиспользование форм в Angular

Проект в Stackblitz со всеми примерами в конце поста. Переиспользуемые элементы управления Проблема
Java Script

Как JavaScript повзрослел и стал настоящим языком

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

Создаем голосовое приложения для Alexa и Google Home

Голосовые приложения полностью изменили наше общение с цифровым миром. Голос добавляет во взаимодействие человека и компьютера новое измерение, которое разработчики только начинают...
Java Script

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

Часть 1, Часть 2, Часть 3 Изменяемое состояние Photo by Alexey Turenkov on Unsplash
Java Script

Основы JavaScript: функции

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

Улучшение производительности .NET Core API

Google предоставляет такую статистику посещаемости веб-страниц: 53% посетителей мобильных сайтов покидают страницу, если она загружается более трёх секунд.https://www.thinkwithgoogle.com/marketing-resources/data-measurement/mobile-page-speed-new-industry-benchmarks/
Java Script

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

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

10 особенностей создания компонентов Vue.js

1. Глобальная и локальная загрузка компонентов Vue.js предоставляет два способа загрузки компонентов: глобально на экземпляре Vue и на...
Java Script

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

Часть 1, Часть 2 Значение рефакторинга Photo by Jason Leung on Unsplash Рефакторинг — это...
Java Script

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

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

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

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

JavaScript Symbols. Новый тип примитивов

Введение В JavaScript есть два основных типа значений. Первый тип — это примитивы, а второй — объекты (в том числе функции). Примитивы — это простые...
Interviews

Как увеличить ваши шансы на получение должности разработчика

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

Мой опыт спустя год работы с React

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

Простейшее объяснение парадокса Монти Холла

Парадокс Монти Холла — это одна из тех математических задач, над решением которой уже долгое время бьются многие умы, и даже всемирно известных математиков...
Programming Languages

Топ 3 самых популярных языка программирования в 2018 году

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

С Kotlin приведение стало еще удобнее

Приведение — это необходимое зло в программировании. Мы обожаем его ненавидеть. В Kotlin выполнять приведение намного приятнее, чем в Java. Читайте ниже об очень...