CodeRoll | Frontend

react-intersection-observer - это готовое решение для использования Intersection Observer API в React приложении, чтобы отслеживать когда элемент появляется в области просмотра и исчезает из него. Ссылка #react

gridstack.js - это библиотека для создания интерактивных дашбордов с возможностью перетаскивания элементов и изменения их размеров. Она совместима React, Vue, Angular, Knockout.js. Демо можно глянуть на сайте. Ссылка #инструменты

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

CSS HD Gradients - это интерактивный инструмент для создания HD-градиентов, созданных с использованием современных цветовых форматов, таких как oklab, LCH, HSL, sRGB и других. Ссылка #css

5 Headless CMS Headless CMS - это CMS с готовым к эксплуатации API, это альтернатива WordPress, Drupal, Joomla или Битрикс. В отличие от классической CMS, в Headless нет механизма отрисовки страниц, нет шаблонов, только инструменты и интерфейс для проектирования данных, работы с данными. В статье рассказывается про 5 Headless CMS, которые стоит попробовать! Ссылка #статьи

DevTools Tips - ресурс, на котором собраны советы по использованию панели разработчика.  О некоторых возможностях DevTools вы возможно даже не подозревали! Например, что через нее можно ускорить или замедлить видео со страницы или что можно отлаживать CSS стили для печати, включив эмуляцию print media. Ссылка #инструменты

Нашли кое-что действительно интересное для тех, кто хочет создавать тренды в мире технологий.  ⚡️ South HUB — кэмп для руководителей в ИТ, который пройдет с 12 по 16 июня в Сочи.  400 настоящих и будущих CTO соберутся на Курорте Красная Поляна, чтобы обменяться знаниями, опытом и найти партнеров. Нетворкинг начинается ещё до кэмпа: все CTO уже собрались здесь.  Кэмп про профессиональное развитие с акцентом на work-life-balance. Программа включает в себя обширную конференц-часть, отдельный день спорта, серию вечеринок и детскую научно-исследовательскую конференцию.  Где встречаемся? На высоте 960 всесезонного горного Курорта Красная Поляна⛰ Вся информация тут.

Bokeh Effect Bokeh Effect (Боке эффект) — это эффект размытого фона, обычно создающийся в фотографии. Но подобный эффект можно создать и с помощью CSS и JavaScript! 8 примеров создания в статье. Ссылка #дизайн

Мониторинг Node.js приложения Мониторинг Node.js важен для поддержания стабильности, надежности и производительности приложений. Можно обнаружить любые проблемы, которые могут отрицательно сказаться на производительности, следя за такими важными показателями, как использование ресурсов, обнаружение ошибок и время ответа. Существует ряд доступных инструментов для мониторинга, каждый из которых имеет определенное назначение и набор функций. В статье рассказывается про 6 лучших! Ссылка #nodejs

Valtio - это относительно новый менеджер состояния для приложений React. Его отличием является использование Proxy, как обертки для состояния.  О преимуществах Valtio и как его использовать читайте в статье.  Ссылка #react

Web Performance Snippets - это сниппеты кода для получения показателей производительности сайта. Например, таких как Largest Contentful Paint (LCP), Cumulative Layout Shift (CLS), Time to First Byte(TTFB), поиск ресурсов блокирующих отрисовку и многие другие. Ссылка #инструменты

reduce Метод reduce - мощный и полезный метод массива, с помощью которого можно проделывать множество операций.  10 продвинутых приемов и советов для reduce в этой статье! Ссылка #js

Node.js 20 18 апреля была выпущена версия 20 Node.js.  Одна из новинок этой версии новая модель разрешений. Модель разрешений Node.js — это экспериментальный механизм, который ограничивает доступ к определенным ресурсам. Она позволяет разработчикам ограничить доступ к определенным ресурсам во время выполнения программы, таким как операции с файловой системой, создание дочерних процессов и рабочих потоков. О всех обновлениях читайте в статье. Ссылка #nodejs

ECMAScript 2023 В этом году последняя версия спецификации ECMAScript должна быть запущена в конце июня. Было принято четыре предложения для версии ES14. Одна из новинок - это методы массива findLast и findLastIndex. Они работают так же, как find и findIndex, но выполняют обход в обратном порядке. Подробнее читайте в статье. Ссылка #статьи

3D заголовок Делимся ссылкой на крутой Code Pen c реализацией 3D заголовка с параллакс эффектом! Ссылка #дизайн

react-visual-grid - это библиотека для создания сеток изображений и masonry-раскладки ("плиточной верстки") с хорошей производительностью. С помощью react-visual-grid вы можете загружать тысячи изображений без ущерба для производительности браузера. Библиотека поставляется со встроенным модулем виртуализации для быстрой и эффективной загрузки изображений. При виртуализации изображения загружаются только по запросу и только тогда, когда они становятся видимыми в окне просмотра. Ссылка #react

readme-dev - это сервис для создания простого и стильного описания для профиля GitHub. Заполните предлагаемые поля вашими данными, скопируйте Markdown и вставьте в свой профиль в файл README.md. Ссылка #инструменты

Итераторы и генераторы Итераторы и генераторы предоставляют механизм для настройки поведения циклов for-of и других конструкций, перебирающих данные.  Этот функционал сперва не очень понятен многим. Автор статьи изложил назначение итераторов и генераторов и варианты их использования, а также рассказал, как использовать весь их потенциал. Ссылка #js

CSS Nesting CSS Nesting позволяет вкладывать одно правило стиля в другое, такую возможность раньше предоставляли только препроцессоры CSS. Но теперь это доступно и в самом CSS. Пока что выпущена только первая версия и поддерживается последними версиями браузеров Chrome и Safari . Но очень радует, что такая возможность появилась! Подробнее о синтаксисе CSS Nesting читайте в статье. Ссылка #css

Смотреть, как зарабатывают другие — классно. Может пора и тебе? На канале @novitskiyblog Алексей Новицкий рассказывает, почему финансовый консультант может зарабатывать такие деньги, которые и не снились IT специалистам, бухгалтерам и финансовым директорам. Вот несколько полезных постов: За что клиент платит финансовому консультанту Как ставить финансовые цели и зарабатывать на этом Где брать клиентов финансовому консультанту Почему не все финансовые консультанты зарабатывают много На канале он собрал личный опыт, кейсы клиентов и полезные материалы по продажам для финансовых консультантов и тех, кто хочет им стать. Подписывайтесь - @novitskiyblog  #реклама