Frontender Libs - обзор библиотек JS / CSS

RendrJS RendrJS – это библиотека, которая позволяет запускать ваши приложения на Backbone.js без проблем как на клиентской стороне, так и на сервере. 👉 @sWebDev

C CSS стоит быть аккуратнее. 👉 @sWebDev | #юмор

Smoothie Bowl Transition Prototype Анимированный макет Figma для проекта, связанного с гастрономией. 👉 @sWebDev

Управление ошибками в React В React 19 появились хуки onCaughtError и onUncaughtError для детального контроля над ошибками в жизненном цикле компонентов. onCaughtError применяется в компонентах-границах ошибок для локальной реакции. Пример:

class ErrorBoundary extends React.Component {
  onCaughtError(error, errorInfo) {
    this.setState({ hasError: true });
    logErrorToService(error, errorInfo);
  }

  render() {
    return this.state.hasError ? <h1>Что-то пошло не так.</h1> : this.props.children;
  }
}

onUncaughtError реагирует на ошибки, не пойманные границами ошибок, обеспечивая реакцию на уровне приложения на критические сбои. Пример:

function App() {
  return (
    <React.onUncaughtError>
      {({ error }) => <div><h1>Непредвиденная ошибка:</h1><p>{error.message}</p></div>}
    </React.onUncaughtError>
  );
}

👉 @sWebDev

-25% на анализы в ИНВИТРО по подписке Газпром Бонус. Газпром Бонус — это подписка-конструктор, с которой вы можете управлять своей выгодой. Добавьте в подписку только нужные предложения от партнеров и получайте выгоду каждый день. Оформите Газпром Бонус с предложением Инвитро всего за 2 ₽ в первый месяц по промокоду KINV. Узнать больше Есть противопоказания. Посоветуйтесь с врачом. #реклама invitro.gazprombonus.ru О рекламодателе

JavaScript-разработчик, когда прошло уже больше 10 минут, а новый JS-фреймворк ещё не появился. 👉 @sWebDev | #юмор

Обучаем Java-разработчиков оплата после выхода на работу В Kata Academy можно выучиться на Java-разработчика бесплатно, а заплатить уже после трудоустройства по специальности из фактической зарплаты. Если задуматься, то все в выигрыше: — ты получаешь работу в Москве или Санкт-Петербурге с хорошей зарплатой, мы получаем процент за инвестиции в тебя; — в наших интересах научить тебя так, чтобы твоя зарплата была как можно выше; — мы прокачиваем твои навыки еще 2 года после курса: проводим выездные мероприятия и мастер-классы — и доходы наших выпускников растут; — мы не зависим от банков и их рассрочек — кризис не повлиял на доступность курсов. Чтобы попасть на курс, нужно выполнить небольшое тестовое задание. Переходи по ссылке и оставляй заявку! Узнать больше #реклама 18+ kata.academy О рекламодателе

Какой из синхронных хуков может вызвать повторные вычисления layout? Какой хук срабатывает синхронно перед layout, но может привести к повторным вычислениям layout, если стили вставляются во время рендеринга? Если забыли, то это было в посте 15.04.2024. 👉 @sWebDev

Inferno Inferno — это библиотека JavaScript, которая предоставляет возможность создавать пользовательские интерфейсы в декларативном стиле. Она разработана с учетом высокой производительности, легкости использования и поддержки серверного рендеринга через inferno-server и NodeJS. 👉 @sWebDev

Infinite Portals Объёмная сцена с бесконечным переходом через портал на Three.js и GSAP. 👉 @sWebDev

Нестабильные тесты в React: обнаружение, предотвращение и инструменты Статья рассматривает проблему нестабильных тестов в React. Они могут привести к ложным срабатываниям системы непрерывной интеграции (CI), замедлить разработку и затруднить выявление реальных ошибок. 👉 @sWebDev

Scroll-based image sequence with GSAP and ScrollTrigger (Helper Function) Анимация пролистывания с динамическим с эффектом освещения на GSAP. 👉 @sWebDev

AnalogJS AnalogJS - это полнофункциональный мета-фреймворк, созданный для разработки приложений и веб-сайтов с помощью Angular. 👉 @sWebDev

FullStackOverflow developer. 👉 @sWebDev | #юмор

Hero with cursor tracking (GSAP) Анимация трекинга курсора на Gsap. 👉 @sWebDev

Как войти в топ по показателям категории в Яндекс Картах Крупная сеть барбершопов хотела привлечь новых клиентов и увеличить количество записей в салоны. Для решения этой задачи было принято решение использовать Брендированное приоритетное размещение с POI (point of interest — дополнение метки логотипом) в Яндекс Картах. По результатам были значительно перевыполнены плановые показатели: ✅ Построенные маршруты превысили целевое значение на 215%. ✅ Более 200 тысяч звонков и маршрутов за четыре месяца. Узнайте больше о настройке рекламы по ссылке: Узнать больше #реклама yandex.ru О рекламодателе

Управление состоянием действий UseActionState - это хук в React, предназначенный для упрощения управления состоянием действий в React-компонентах, который был введен для улучшения существующего хука useFormState. Использование:

const [state, action] = useActionState({
  initialState: {
    // Начальное состояние
  },
  actions: {
    // Определите действия
    increment: () => {
      // Логика действия
    },
    decrement: () => {
      // Логика действия
    },
  },
});

Пример:

const Counter = () => {
  const [count, actions] = useActionState({
    initialState: { count: 0 },
    actions: {
      increment: () => ({ count: count + 1 }),
      decrement: () => ({ count: count - 1 }),
    },
  });

  return (
    <div>
      <p>Счетчик: {count}</p>
      <button onClick={actions.increment}>Увеличить</button>
      <button onClick={actions.decrement}>Уменьшить</button>
    </div>
  );
};

👉 @sWebDev

Расставляй приоритеты правильно. 👉 @sWebDev | #юмор