Завершаем настройку мощного API на Nodejs, GraphQL, MongoDB, Hapi, и Swagger. Часть 2
Это вторая часть в серии, где мы строим мощный API GraphQL. Пожалуйста, посмотрите первую часть нашей статьи,если вы до сих пор этого не сделали.
Я знаю,...
Введение: 4 новейших операции JavaScript
Технический комитет 39 (TC39) — это группа экспертов по JavaScript, которые работают над стандартизацией ECMAScript.
Рабочий процесс TC39 состоит из нескольких этапов:
Этап 0 (Идея): прием...
JWT-аутентификация в Spring Boot Webflux
Spring Security всегда снижал мой интерес к собственным проектам. Как только возникала необходимость выяснить как аутентифицировать пользователей, я сразу начинал испытывать негодование или скуку...
20 скрытых особенностей JavaScript
Представленные ниже 20 хитростей JavaScript были указаны пользователями Stack Overflow.
1. Работа с аргументами функций
Вам не нужно определять параметры для функции — можете просто использовать...
10 продвинутых приемов JavaScript для опытных разработчиков
Даже у опытных разработчиков есть возможности для профессионального роста. Эти продвинутые приемы JavaScript помогут повысить производительность труда, а также эффективность и удобство в обслуживании приложений.
3 способа визуализации больших списков в Angular
Мы рассмотрим следующие техники: виртуальная прокрутка (с использованием Angular CDK), ручной рендеринг и прогрессивный рендеринг. Несмотря на то, что для их реализации мы будем...
3 важных рекомендации Django-программистам
Django — это очень интересный фреймворк, который позволяет создавать веб-приложения с использованием Python для бэкенда. При этом он также может обрабатывать большинство функций базы...
Автоматизация создания стикеров с помощью веб-скрейпинга и обработки изображений в Python
Познакомьтесь с автоматизированным способом создания стикеров для мессенджеров. Краткая пошаговая инструкция поможет вам быстро сгенерировать стикерпак в Telegram.
Репозитории GitHub в помощь каждому веб-разработчику
Я недавно узнал о репозитории с полезным контентом (что для меня самое важное) и решил углубиться в тему, составив список репозиториев GitHub, которые принесут...
1 Кодовая база - 3 платформы
Все, что нужно знать для успешного развертывания кроссплатформенного приложения в 2021 году.
Представим простую ситуацию:
Вы соло-разработчик. У вас появилась идея. Вы делитесь ей со своими друзьями....
Взгляд на RedwoodJS
Привносим фулстек в JAMstack
Несколько дней назад я просматривал Hacker News и наткнулся на интересный пост под названием “Redwood: интегрированный фулстек JavaScript веб-фреймворк для JAMstack.” В...
11 инструментов для ускорения создания пользовательского интерфейса
Предлагаем подборку бесплатных инструментов для стилистического оформления пользовательских интерфейсов. Они помогут фронтенд-разработчикам и дизайнерам существенно сэкономить время и повысить производительность.
Google OAuth для реализации на Ruby
Будем реализовывать единый вход Google OAuth для веб-сайта. Библиотека google-api-client устарела (о чем упоминается в Google Identity Document). Правда, есть еще одна подходящая для...
Создаём расширение для Chrome
Написать расширение для Chrome непросто. Это не то же самое, что разработка веб-приложения: не хочется перегружать браузер оверхедом JS, ведь расширения работают одновременно с...
ANGULAR v7: подсказки командной строки, виртуальная прокрутка, перетаскивание и др.
Версия Angular 7.0.0 уже вышла! Это основной релиз, который затронул всю платформу, включая ядро, Angular Material, и командную строку с синхронизированными базовыми версиями. В...
Секретные материалы: тайная сторона Redux становится явной ?
В процессе создания всё более сложных и крупных приложений в React начинаешь понимать, что управление общим состоянием всего приложения невозможно только при помощи класса...
Резолвер в Angular для предвыборки данных
Что такое резолвер в Angular?
Резолверы в Angular используются для предварительной выборки данных: пока пользователь перенаправляется с одного маршрута на другой, новая доступная страница уже будет...
Быстрый веб-скрейпинг с библиотекой Polars
Рассказываем, как с помощью Polars выполнить простой и быстрый веб-скрейпинг с превращением таблиц с HTML-страниц в датафреймы Polars.
19 лучших инструментов прототипирования для дизайнеров UX/UI
Прототипирование выполняет роль чертежа и позволяет разработчикам просмотреть полный обзор сайта или приложения до начала его создания.
Это необходимый шаг в дизайнерском процессе, поскольку он...
Замечательные новые фичи TypeScript 3.5
Новые фичи включают в себя:
увеличение скорости для поэтапных сборок; вспомогательный тип Omit;улучшенные проверки избыточных свойств в типах объединения;вывод типов для объединения конструкторов.
Увеличение скорости
С режимом сборки...
Основы разработки приложений: уровень клиента
Современное веб-приложение - сложный программный продукт. Обратившись к эволюции веб-приложения, в процессе которой значительно повысилось качество этого продукта, можно лучше понять принципы его работы на уровне клиента.
Полное руководство по React Context
Context - это необходимый для разработчиков инструмент React. Он упрощает обмен состоянием в приложениях. Рассмотрим особенности и назначение React Context, выясним в каких случаях он действительно нужен.
Зачем усложнять разработку с AWS Lambda?
Время подискутировать! Автор рассматривает наметившуюся тенденцию усложнять бессерверную разработку с помощью AWS Lambda и высказывается за сохранение простоты и модульности данного сервиса.
Архитектура ПО: разница между архитектурой и проектированием
Многие не знают, в чем состоит разница между архитектурой и проектированием приложения. Даже сами разработчики зачастую не могут разобрать строку кода и могут спутать...
Стратегии обнаружения изменений в Angular - «onPush» и «Default»
В Angular есть две стратегии обнаружения изменений — «Default» и «onPush». Рассмотрим преимущества и недостатки этих стратегий.
Что такое «обнаружение изменений» в Angular?
Механизм обнаружения изменений в...
Руководство по AWS: настройка экземпляра EC2 для развертывания приложений Java
Запустим и настроим экземпляр EC2 для среды Java на AWS. Установим в нем дополнительное ПО, протестируем.
Создаем функции поиска и фильтрации в Ruby on Rails
Ruby on Rails замечательно подходит для создания мощного и гибкого бэкенда. Однако из-за популярности и гибкости JavaScript, Ruby используется для фронтэнда не так часто....
Мы забываем основы фронтенд-разработки
Почему, увлекаясь новыми подходами, мы пренебрегаем основами разработки? Может ли следование лучшим практикам лишить критического мышления? Всегда ли стоит все усложнять и оптимизировать? Поразмыслим над этими вопросами, анализируя фрагменты кода из реальных проектов.
Я разработал и запустил MVP продукт за 5 дней
За последний год я запустил несколько продуктов, каждый из которых потребовал от 3 до 6 месяцев от момента возникновения идеи до запуска. В то...
Переключатель темного режима в веб-приложении
Краткая инструкция по добавлению в приложение функции подстройки под цветовую схему системы, а также переключателя для изменения этой схемы внутри самого приложения.
Состояние гонки в Node.js: практическое руководство
Специалисты, имеющие отношение к параллельному проектированию, иногда сталкиваются с так называемым состоянием гонок. Сегодня поговорим о том, чем чревато такое явление, что его вызывает и как с ним бороться.
Пишем кастомные React-хуки для GraphQL
Примечание: на данный момент хуки в React являются экспериментальными
Недавно на React Conf 2018 был представлен выпуск новых API для React, что повлекло за собой...
Как JavaScript повзрослел и стал настоящим языком
Мало кто представлял себе, что этот язык превратится в профессиональную платформу
Если ещё лет 20 назад вы бы сказали, что JavaScript станет одним из самых...
JavaScript async/await: что хорошего, в чём опасность и как применять?
Механизм async/await , представленный ES7, является фантастическим улучшением асинхронного программирования с использованием JavaScript. Он предоставил возможность использовать код, написанный в синхронном стиле, для асинхронного доступа к...
Map, CompactMap и FlatMap в Swift
В типичном приложении работа с массивами — вполне обыденное дело. Нам нередко приходится перебирать все элементы, применяя к ним необходимые изменения.
Для этой задачи многие...
Супергеройский макет: комбинируем CSS-сетки и CSS-фигуры
В этой статье мы создадим макет страницы комикса с панелями уникальной формы. Просмотреть готовую демо-версию можно на CodePen.
Вдохновением для макета послужит страница комикса Generations:...
Основы JavaScript: управление DOM элементами (часть 3)
Часть 1, Часть 2, Часть 3
Навигация по DOM элементам
Обход DOM или, проще говоря, навигация по DOM элементам — это работа со свойствами родительских, дочерних и соседних...
Мониторинг сайта: просто, но эффективно
На тему мониторинга приложения уже написано немало литературы. Одно время я работал консультантом по программному обеспечению на предприятии, где под нашим бдительным оком находилось...
Пять алиасов Git, без которых мне не прожить
Я большой фанат коротких путей.
Алиасы, хаки, скрипты, автоматизация, обходные варианты… я люблю избыточную оптимизацию, поэтому неудивительно, что мне особенно нравится функциональность алиасов в Git — настолько,...
Основы JavaScript: управление DOM элементами (часть 1)
Объектная модель документа или DOM определяет логическую структуру HTML документа и в основном представляет собой интерфейс веб-страниц. С помощь таких языков программирования, как JavaScript,...
Как оформить поле ввода: советы и техники
Как быстро и легко разработать поле ввода? Ответим на этот и сопутствующие вопросы доступным языком.
Повесть об однонаправленном потоке данных в Angular
У Angular есть свои фишки и причуды. В то время как React реализует модель однонаправленного потока данных по умолчанию, Angular с самого начала точно...
Как сделать темную тему с помощью CSS
На днях я баловался с темной версией в новой версии MacOS Mojave. Мои глаза не на 100% рады, но это особенно полезно, когда залипаешь...
Советы по анимации с CSS и JavaScript
Основы “плавности”
Анимации - важная часть создания привлекательных веб-приложений и сайтов. Пользователи ожидают высокую отзывчивость и интерактивность.
В классической анимации движение, скорость которого в начале низкая,...
11 главных фронтенд-трендов на 2020 год
1. Микрофронтенды
Звучит иронично, но несмотря на то, что фронтенд-разработка обладает модульными преимуществами компонентов, она все еще более монолитна, чем бэкенд-микросервисы.
Микрофронтенды предоставляют возможность разделения фронтенд-архитектуры...
Первые шаги в анимации React Native
Когда я только начал работать с React Native (RN), у меня никогда не доходили руки до изучения анимации. Многие вещи казались важнее, поэтому я...
UX в 2021 — что ожидать?
UX-дизайн — это переменчивая сфера, в которой появляются новые направления каждый год, и последний — не исключение. COVID-19 и всемирная изоляция внесли неожиданные коррективы...
Руководство по Webpack для начинающих
Webpack - мощный и удобный инструмент программиста. Эта технология позволяет разработчику анализировать модули приложения и собирать их в правильном порядке. Рассмотрим подробно, как работает Webpack.
Создание компонентной дизайн-системы UI
Создание и обслуживание согласованного UI и UX (опыт взаимодействия пользователя с приложением) во всех частях вашего продукта помогает пользователям интуитивно перемещаться и успешно взаимодействовать...
Жизненный цикл разработки на примере сайта
Рассмотрим процесс создания сайта с точки зрения жизненного цикла разработки ПО и подробно изучим каждый из 6 его этапов.
Создаем на JavaScript приложение записи заметок в реальном времени
Подробная инструкция, включая настройку аутентификации, реализацию real-time обновления приложения при внесении изменений в БД и процесс авторизации через Google-аккаунт.
Движки JavaScript. Часть 2: генерация кода и базовые оптимизации
В этой части продолжим разговор о том, как работают движки JavaScript. Поговорим о компиляторах, этапах создания кода и основных оптимизациях.
Проблема устаревших замыканий и способы ее решения в React. Часть 2
В этой части руководства вы узнаете, как не угодить в ловушку устаревших замыканий в распространенных скриптах React, таких как useCallback, React.memo, Ref.
Javascript и функциональное программирование. Часть 2: полноправные функции
Предыдущие части: Часть 1
Добро пожаловать в параллельный мир
Вам необходимо кое-что узнать прежде, чем мы начнем... Если вы когда-либо программировали в JS, вы, вероятно, раньше использовали...
notebookJS: JavaScript и D3 в Jupyter Notebook
Вы когда-нибудь задумывались о том, как здорово было бы использовать визуализацию данных с помощью D3 или React в Jupyter Notebook? Много раз, скорее всего....
Руководство по принципам моушн-дизайна
Моушн-дизайн отличается особым воздействием на пользовательский опыт цифровых продуктов. Однако, если элементы интерфейса не демонстрируют основные принципы моушн-дизайна, пригодность пользовательского опыта стоит под вопросом....
Плюсы и минусы Deno
Краткий обзор достоинств и недостатков новой среды выполнения Deno, а также ее сравнение со всем известной и привычной средой Node.
Интересные подробности об объектах JavaScript
Объекты в JavaScript являются основой. Так что более глубокое их изучение позволит писать вам более чистый и производительный код.
Примечание: эта статья подразумевает наличие у...
Как перейти от Flask к FastAPI
Из этой статьи вы узнаете о фундаментальных концепциях FastAPI и научитесь переносить сервер с Flask целиком на FastAPI.
FastAPI представляет собой современный, быстрый (высокопроизводительный) веб-фреймворк...
Aurora UI - новый визуальный тренд в 2021 году
UI-дизайн, особенно его художественная, визуальная сторона постоянно развивается. В то время как большинство современных продуктов повторяют одни и те же, проверенные и хорошо известные...
Запуск с нуля: как я создала сайт с нуля при помощи Netlify + Gatsby
После года работы front-end разработчиком, я решила создать свой собственный сайт. Это должна была быть платформа, где я могла показать свою работу, чем-то поделиться....
Раскрываем силу JavaScript: сокращение размера пакета NPM на 99%
Ищете пути повышения производительности приложения? Ознакомьтесь со способами значительного улучшения метрик в Lighthouse и FCP в проектах с использованием пакета дизайн-системы.
Как выглядит нескучный модульный лендинг React
Рассмотрим красивый шаблон лендинга с качественным кодом и улучшенной доступностью. Разберемся, что делает его структурированным, самодокументируемым и легко настраиваемым.
Конфигурация файла PHP.INI
Файл конфигурации php.ini является прямым методом влияния на функциональность PHP. Расскажем о его важных настройках, которые могут понадобиться для парсера PHP.
Утверждения, применяемые при импортировании в JavaScript
Количество имеющихся в мире данных с течением времени продолжает бурно расти. Этот огромный объем существует во многих различных типах данных: текстовых файлах, изображениях, видео,...
Дата и время в JavaScript
Учимся работать с датой и временем в JavaScript: разбираемся с определением и способом создания объекта Data, его методами и форматами вывода.
TypeScript: основы
Если вы уже знакомы с JavaScript, обязательно освойте TypeScript. Этот язык не просто облегчит написание кода. Он сделает программирование по-настоящему увлекательным процессом.
Как загружать изображения в RAILS API и возвращать их обратно
Мне потребовалась неделя, чтобы написать back-end основу для Supagram при помощи Rails API. Supagram — это легкий браузерный клон Instagram, в котором есть те же посты,...
Как профессионально использовать сопоставимые типы TypeScript
Хотите освоить сопоставимые типы TypeScript и понять, как работают встроенные в TypeScript типы утилит? Этот краткий обзор, подкрепленный анимационными вставками, поможет разобраться во всем этом.
Веб-разработка: основы статического сайта
Статический веб - это то, с чего начинался интернет. Статические веб-технологии часто используются для разработки шаблонов динамических страниц. Поэтому познакомиться с основами веб-статики будет нелишним для каждого веб-энтузиаста, особенно начинающего.
Полный гайд по SCSS/SASS
Далее я убуду использовать названия Sassy, Sass и SCSS, поэтому давайте определимся, так как концептуально разница не велика, будем считать, что это одно и...
5 продвинутых шаблонов React на пальцах
Знакомство с наиболее эффективными шаблонами через примеры их реализации, а также сопоставление основных плюсов и минусов.
Современный backend-разработчик 2018
Веб-разработка сегодня разительно отличается от того, что было пару лет назад, а обилие новых техник сбивает с толку новичков в программировании. Это и послужило...
Структура типизации в Ruby 3
Об авторе: Соутаро является ведущим разработчиком Ruby в Square, работающим над Steep и статической типизацией; вместе с Матцем и другими разработчиками ядра он работает...
Next.js и React.js: что выбрать для проекта
Какой фреймворк - React.js или Next.js - стоит использовать в проекте, чтобы получить максимальную выгоду? Разберем оба фреймворка и определим, какие преимущества дает каждый из них.
Из двух модулей Angular выбирай лучший- задачка для программиста
Важным аспектом любой системы, определяющим будущую лёгкость обслуживания и чистоту кода, является ее модульная структура, при чем независимо от размера этой системы. В этой...
Эти маленькие сниппеты кода изменили мир
Всего несколько коротких строк кода способны оказать огромное влияние на развитие интернет-технологий по всему миру. Вот несколько примеров.
Что такое Deno и заменит ли он NodeJS?
Для тех, кто не совсем в теме, Deno — это детище Райана Даля, ставшего известным благодаря созданию Node.js, который вам, наверняка, знаком. Значит ли это, что...
3 альтернативы репозитория в Laravel
Рассмотрим преимущества и недостатки шаблона «Репозиторий». Изучим три альтернативы абстрагирования управления данными: заготовки Eloquent, пользовательские запросы и классы action.
Руководство по применению паттерна Event Bus в архитектуре React
Подробно разберем паттерн проектирования Event Bus, попрактикуемся в создании и задействуем его в React.
Развертывание Flask приложения на Heroku и подключение к БД MySQL - JawsDB
Проблемы развертывания
Новички часто устанавливают все пакеты на системном уровне из-за отсутствия опыта (например, с помощью pip). Получение зависимостей из requirements.txt для каждого проекта создаёт...
ТОП-25 библиотек React 2021–2022: новые, полезные, но малоизвестные пакеты JavaScript
React Content Loader, React Filepond, React Select, React Query, React Hook Form, React Infinite Scroller и другие библиотеки JavaScript
Веб-скрейпинг с помощью Python и BeautifulSoup
Получение данных из Всемирной паутины может оказаться трудоемким и времязатратным процессом. Но подобные задачи можно легко автоматизировать с помощью технологии веб-скрейпинга. Поговорим о том, как извлекать данные с сайтов с помощью Python и библиотеки BeautifulSoup.
Sniper-CSS: как избавиться от неиспользуемых стилей
Рассмотрим на практическом примере, как сократить код приложения, избавившись от неиспользуемых стилей. Кроме того, поделимся эффективными инструментами для работы.
Давайте разберемся с методами: slice( ), splice( ) и split( ) в JavaScript
Всю пользу встроенных методов JavaScript можно оценить только правильно понимая, как они работают. В этой статье мы разберем три метода: slice (), splice () и split (). Даже...
7 приложений и сайтов, которые облегчат работу UX/UI дизайнера
Рассмотрим 7 приложений и сайтов для UX/UI дизайнера и подробно изучим основные функции, особенности и области использования каждого из них.
Знакомимся с основами Angular через создание простого приложения
Готовы сегодня создать что-нибудь интересное? Я тоже!
На данный момент я тружусь в роли Angular-разработчика, создавая для сотрудников нашей компании инструменты, которые помогают им более...
20 сокращений JavaScript, которые сэкономят ваше время
В любом языке программирования сокращения помогают написать более чистый и оптимизированный код и выполнить задачи, использовав кротчайший синтаксис. Разберём способы сокращения в JavaScript.
1. Объявление...
6 шагов по созданию расширения Chrome, которое можно продать
Простой способ организации пассивного заработка без особых хлопот. Минимальный комплект необходимых инструкций прилагается.
Ember.js или Vue.js: какой фреймворк выбрать?
Изначально JavaScript создавался для работы с веб-приложениями, однако теперь он используется для создания мобильных приложений. Фреймворки на основе JavaScript популярны среди разработчиков, поскольку они...
Топ-10 библиотек React для создания высокопроизводительных веб-приложений в 2023 году
Не все решения React предоставляются в готовом виде "из коробки". Поэтому приходится обращаться к дополнительным инструментам. Чтобы не тратить время на поиски подходящего фреймворка, воспользуйтесь обзором лучших библиотек React, помогающих эффективно решать различные проблемы.
Разработка масштабируемых фронтендов с помощью Feature-Sliced Design
Предлагаем пошаговое руководство по созданию современных фронтендов с помощью Feature-Sliced Design и Bit. Использование этого подхода позволит организовать приложение в четко структурированном виде, быстро ориентироваться в нем и лучше понимать его специфику.
Избавляемся от рендеринга в Angular: только функциональность и никакого рендера
Я ежедневно работаю как с Angular, так и с React, а также большой поклонник Vue и Svelte и слежу за их развитием. В этой...
Как ускорить full-stack разработку, не создавая API
Разберемся, как повысить продуктивность за счет автоматизации всех взаимодействий между клиентом и сервером. Большая история проб, ошибок и поисков правильного решения в одной маленькой статье.
Тестирование производительности приложения в браузере Chrome
Введение
В процессе разработки часто возникает потребность протестировать в браузере производительность приложения. Такое тестирование способствует обнаружению потенциальных ошибок, замедляющих его работу. В данной статье вашему...
JavaScript: 5 нововведений 2021 года
JavaScript — это легкий для освоения язык программирования, что делает его весьма подходящим для начинающих. За многие годы он развился до такой степени, что...
10 API консольных утилит Chrome
1. monitor
Используется для мониторинга функции:
function traceFunc (arg) { }
monitor(traceFunc)
Функция traceFunc передается в качестве аргумента в monitor. Теперь при каждом вызове traceFunc на мониторе будет...
Сравниваем WebGL-фреймворки Three.js и Babylon.js
Возможно, вы уже изучили информацию на Slack и Github, сравнивая длинный список плюсов и минусов, но все еще не можете определить, какой же из...
GitHub Codespaces: быстрая разработка на ходу с Flutter
В прошлую пятницу мне на почту пришло приглашение попробовать бета-версию GitHub Codespaces!
Я сразу же взял один из своих примерных проектов на Flutter (Fluttersaurus) и...
Создание простого веб-скрейпера на Ruby
Введение
Один из лучших способов доступа к данным сайта — через его API (интерфейс прикладного программирования). Но что, если у сайта нет API? Тогда стоит...
5 самых полезных приемов в JavaScript
Краткая и полезная информация о практичных приемах в JavaScript от опытного разработчика. Если вы уже работали с этим языком, то не будет лишним обновить знания, а новичкам стоит обратить особое внимание на эти приемы.
Секреты эффективного управления разработкой
Представляем вашему вниманию 50 советов о том, как добиться успеха на посту руководителя проектного отдела.
Конструкция контейнера в Docker
Контейнеризация приложений - основной принцип работы платформы Docker при разработке, тестировании и запуске веб-приложений. Эта краткая шпаргалка по важным концепциям и командам в процессах контейнеризации напомнит о свойствах образов, файлов, сетей и томов данных.
Двоичное дерево поиска: вставка значения с использованием JavaScript
Двоичное дерево — это древовидная структура данных, в которой каждый элемент имеет не более 2 дочерних элементов. Эта структура данных состоит из трех основных элементов:
1. Данные
2....
Учимся программированию как Эйнштейн
Эйнштейн был гением и одним из величайших ученых, когда-либо живших на земле. В 1905 году он опубликовал четыре научные работы, заложившие основы современной физики...