Кастомные хуки в React: как выносить логику в отдельные функции

✏️ Продолжаем улучшать архитектуру нашего To Do List. Покажу, как вынести бизнес-логику работы с задачами из контекста в отдельный кастомный хук useTasks. Создадим хук с нуля, перенесём в него стейт, обработчики и фильтрацию, подключим в контекст. Затем декомпозируем код дальше: создадим отдельный хук useIncompleteTaskScroll для прокрутки к первой невыполненной задаче и useTasksLocalStorage для работы с LocalStorage. Разберём, зачем дробить логику на хуки и как это помогает масштабировать проект. Закрепим всё на практике и сравним, насколько чище стал код после рефакторинга. 🔴 Timeline: ▶ 00:00 | Введение ▶ 00:39 | Что такое кастомный хук ▶ 02:26 | Анализ текущего кода и создание кастомного хука useTasks ▶ 04:47 | Создание дополнительного хука useIncompleteTaskScroll ▶ 07:33 | Создание дополнительного хука useTasksLocalStorage ▶ 12:20 | Архитектура и масштабирование хуков ▶ 14:02 | Заключение 📚 Ссылки из видео: 🧑‍💻 Основной телеграм-канал: 💬 Коммьюнити-чат в телеграме (помощь новичкам): 🗂️ Бесплатные курсы на канале: 📌 Автор: #reactjs