Код-ревью: 8 ошибок в 1 кнопке! Переписываем реальный проект на React.

На практических проектах со студентами каждый день ревьюим код по совершенно разным направлениям. Накопилось уже много подробных PR и мы подумали, что этот материал может оказаться полезным не только практикующимся студентам, но и в целом тем, кто стремится к апгрейду своих проектов. Будем говорить как об ошибках, так и о фишках, которые всего за пару строк сильно повышают общее качество кода. В этом видео разберем кнопку в проекте на React. Основные моменты, которые затронем: conditional styles, разделение ответственности, наследование, замешивание логики, Props, работа с Shared UI, наличие Ref / forwardRef, использование className, грамотное наименование цветов. Все перепишем и проверим на практике. Если формат понравится — пишите в комментариях, что хотели бы разобрать в следующих выпусках. По комментариям будем подбирать кейсы для следующих видео. Полезные видео: 🍿 Вышел React 19 — 🍿 Последний выпуск новостей веб-разработки — Телеграм-канал с советами по разработке: Бесплатные бонусы: ➔ Бесплатная карта развития в разработке под вашу ситуацию — ➔ Бесплатный курс «Основы разработки» — ➔ Бесплатный курс «CSS Flexbox» — Полное обучение: ➔ Доступный практический курс по React. Вместе напишем 4 комплексных проекта и освоим ключевые навыки работы с Hooks, Redux Toolkit, React Router с поддержкой наставника — Навигация: 0:00 — Интро 1:04 — 1: Лишние Conditional styles 2:07 — 2: Разделение ответственности в рамках компонента 3:40 — 3: Отсутствие наследования 5:23 — 4: Замешивание логики 8:42 — 5: Важные моменты в Props 10:48 — 6: Наличие Ref / forwardRef 12:31 — 7: Использование className 12:57 — 8: Наименование цветов 13:56 — Аутро