React-код часто разрастается не потому, что интерфейс сложный, а потому что в него попадает логика, которую давно умеет выполнять CSS. В этом выпуске показываем, как сократить React-компонент почти вдвое, перенеся вычисления и состояния в стили — без потери функциональности и читаемости. В этом выпуске: - Почему большая часть логики в UI — это логика отображения, а не бизнес-логика. - Классическая реализация слайдера на React: состояние, вычисления, условия и шаблон на сотню строк. - Как перенести расчёты положения, масштаба и активного состояния элементов в CSS. - Использование CSS Custom Properties и calc() для вычислений вместо JavaScript. - Что такое «реактивный CSS» и как он взаимодействует с React. - Когда можно начать использовать реактивный CSS. Главная идея выпуска — перестать использовать React как калькулятор для стилей и начать применять CSS как полноценный инструмент с логикой и вычислениями. Это делает компоненты короче, понятнее и проще в поддержке. Выпуск «Реактивный CSS близко» → https://youtu.be/EjagIuoM5qM Канал в Телеграм → https://t.me/cssbol Таймкоды: 00:00 Введение 00:48 Демонстрация слайдеров 01:39 Анализ логики слайдера 03:03 Код на React 04:30 Реализация с CSS 05:54 Детали CSS-кода 06:53 Будущее использования 07:32 Заключение #css #frontend #webdevelopment