react-beautiful-dnd - это готовый React drag-and-drop компонент в виде списка, внутри которого можно перетаскивать и менять местами элементы.
Из преимуществ стоит отметить хорошую производительность и плавную анимацию при перетаскивании.
Демо можно глянуть по ссылке в репозитории.
Ссылка на репозиторий
#react
Из преимуществ стоит отметить хорошую производительность и плавную анимацию при перетаскивании.
Демо можно глянуть по ссылке в репозитории.
Ссылка на репозиторий
#react
👍2
January 11, 2023
January 13, 2023
NoSQL vs. SQL
SQL и NoSQL — это две разные концепции систем баз данных.
SQL — это язык, используемый в качестве стандарта для запросов и изменения систем баз данных, используемых большинством веб-сайтов и приложений.
NoSQL относится к любой базе данных, которая не использует SQL в качестве основного интерфейса.
Подробнее о концепции NoSQL и сравнение с SQL читайте в статье!
Ссылка
#статьи
SQL и NoSQL — это две разные концепции систем баз данных.
SQL — это язык, используемый в качестве стандарта для запросов и изменения систем баз данных, используемых большинством веб-сайтов и приложений.
NoSQL относится к любой базе данных, которая не использует SQL в качестве основного интерфейса.
Подробнее о концепции NoSQL и сравнение с SQL читайте в статье!
Ссылка
#статьи
January 16, 2023
January 18, 2023
Метод structuredClone
Оператор spread(...) — это распространенный метод для копирования объектов в JavaScript. Однако, имеет один существенный недостаток — он создает поверхностные копии. Копируются только верхние уровни свойств.
structuredClone() - это функция, которая создает глубокие копии объектов. Имеет достаточно неплохую поддержку.
Подробнее о данной функции читайте в статье.
Ссылка
#js
Оператор spread(...) — это распространенный метод для копирования объектов в JavaScript. Однако, имеет один существенный недостаток — он создает поверхностные копии. Копируются только верхние уровни свойств.
structuredClone() - это функция, которая создает глубокие копии объектов. Имеет достаточно неплохую поддержку.
Подробнее о данной функции читайте в статье.
Ссылка
#js
👍1
January 20, 2023
siimple — это CSS библиотека с открытым исходным кодом для стилизации. Она предлагает красивый и минималистичный дизайн.
Она полностью настраиваемая. С помощью конфигурации меняются цвета, шрифты, размеры, тени и многое другое! Дополнительно можно подключить коллекцию иконок.
На официальном сайте библиотеки предложены примеры стилизованных с помощью нее компонентов. Можно скопировать код и использовать в своем проекте.
Подробнее информацию смотрите на сайте.
Ссылка
#инструменты
Она полностью настраиваемая. С помощью конфигурации меняются цвета, шрифты, размеры, тени и многое другое! Дополнительно можно подключить коллекцию иконок.
На официальном сайте библиотеки предложены примеры стилизованных с помощью нее компонентов. Можно скопировать код и использовать в своем проекте.
Подробнее информацию смотрите на сайте.
Ссылка
#инструменты
January 23, 2023
January 25, 2023
January 27, 2023
Git-Sim
Git на первый взгляд кажется запутанным и сложным инструментом, особенно для новичка.
Git-Sim — это инструмент командной строки, который позволяет пользователю Git быстро и легко создавать изображения или видео-анимации, иллюстрирующие влияние команды Git на локальное хранилище.
Например, можно получить схему работы команды git reset HEAD^ или любой другой.
Подробнее о Git-Sim рассказывается в статье!
Ссылка
#статьи
Git на первый взгляд кажется запутанным и сложным инструментом, особенно для новичка.
Git-Sim — это инструмент командной строки, который позволяет пользователю Git быстро и легко создавать изображения или видео-анимации, иллюстрирующие влияние команды Git на локальное хранилище.
Например, можно получить схему работы команды git reset HEAD^ или любой другой.
Подробнее о Git-Sim рассказывается в статье!
Ссылка
#статьи
👎2🔥1
January 30, 2023
pure.css
Yahoo! является создателем библиотеки pure.css.
Pure.css - это библиотека для создания интерфейса веб-приложений. Она включает шаблоны оформления для форм, кнопок, таблиц, блоков навигации и прочих UI компонентов.
- Библиотека мало весит и быстро загружается;
- Она включает адаптивную сетку, которая автоматически подстраивается под разные размеры экрана и устройства;
Подробнее о ней читайте в статье!
Ссылка
#css
Yahoo! является создателем библиотеки pure.css.
Pure.css - это библиотека для создания интерфейса веб-приложений. Она включает шаблоны оформления для форм, кнопок, таблиц, блоков навигации и прочих UI компонентов.
- Библиотека мало весит и быстро загружается;
- Она включает адаптивную сетку, которая автоматически подстраивается под разные размеры экрана и устройства;
Подробнее о ней читайте в статье!
Ссылка
#css
👍2
February 1, 2023
scrollend - это новое событие в JavaScript.
До scrollend не было надежного способа определить, завершена ли прокрутка. Это означало, что события могут срабатывать поздно или пока палец пользователя все еще находится на экране. Для решения придумывали разные способы. И вот наконец-то для этого появилось специальное событие.
Оно не поддерживается пока всеми браузерами, но его появление уже радует.
Подробнее o нем читайте в статье!
Ссылка
#js
До scrollend не было надежного способа определить, завершена ли прокрутка. Это означало, что события могут срабатывать поздно или пока палец пользователя все еще находится на экране. Для решения придумывали разные способы. И вот наконец-то для этого появилось специальное событие.
Оно не поддерживается пока всеми браузерами, но его появление уже радует.
Подробнее o нем читайте в статье!
Ссылка
#js
👍3
February 3, 2023
ScrollyVideo.js - это JavaScript библиотека для воспроизведения и перемотки видео на основе события scroll.
Она совместима с React, Svelte, Vue и нативным JavaScript.
Эффект получается классный! Демо можно глянуть на сайте.
Ссылка
#инструменты
Она совместима с React, Svelte, Vue и нативным JavaScript.
Эффект получается классный! Демо можно глянуть на сайте.
Ссылка
#инструменты
February 6, 2023
February 8, 2023
6 лучших генераторов фона
Чтобы не тратить много времени на придумывание дизайна для своего сайта, существует много крутых вспомогательных инструментов и генераторов для создания каких-то отдельных элементов.
Одни из таких инструментов - это генераторы фона. В этой статье собраны лучшие по мнению автора!
Ссылка
#дизайн
Чтобы не тратить много времени на придумывание дизайна для своего сайта, существует много крутых вспомогательных инструментов и генераторов для создания каких-то отдельных элементов.
Одни из таких инструментов - это генераторы фона. В этой статье собраны лучшие по мнению автора!
Ссылка
#дизайн
February 10, 2023
node api boilerplate - это шаблон для создания масштабируемого API с помощью Node.js и TypeScript.
Он был реализован в соответствии с идеями многоуровневой и чистой архитектуры и предметно-ориентированного проектирования (DDD - Domain-Driven Design).
При его создании были учтены возможность расширения и гибкость, поэтому его можно изменять и адаптировать в соответствии с вашими потребностями и предпочтениями.
Ссылка
#nodejs
Он был реализован в соответствии с идеями многоуровневой и чистой архитектуры и предметно-ориентированного проектирования (DDD - Domain-Driven Design).
При его создании были учтены возможность расширения и гибкость, поэтому его можно изменять и адаптировать в соответствии с вашими потребностями и предпочтениями.
Ссылка
#nodejs
👎2👍1
February 13, 2023
Largest Contentful Paint (или LCP) — это одна из трех метрик Core Web Vitals. Эти показатели используются Google для оценки качества UX. LCP измеряет время, необходимое браузеру для загрузки основного содержимого в области просмотра.
Основным содержимым для LCP обычно является самый крупный элемент. Этим элементом может быть изображение, видео или просто большой блок текста.
В статье рассказывается, как оптимизировать этот показатель для изображений!
Ссылка
#статьи
Основным содержимым для LCP обычно является самый крупный элемент. Этим элементом может быть изображение, видео или просто большой блок текста.
В статье рассказывается, как оптимизировать этот показатель для изображений!
Ссылка
#статьи
February 15, 2023
Meta Tags Generator - это онлайн-инструмент для создания полного списка метатегов HTML для сайта.
Результат включает общие метатеги, open graph, schema.org и метатеги социальных сетей.
Ссылка
#html
Результат включает общие метатеги, open graph, schema.org и метатеги социальных сетей.
Ссылка
#html
February 17, 2023
February 20, 2023
LazyBrush - это JavaScript библиотека для рисования плавных кривых и прямых линий с помощью мыши, пальца или любого poniting устройства.
Ссылка
#инструменты
Ссылка
#инструменты
👍2
February 22, 2023
February 24, 2023