Копия Miro на чистом React | Без стейт менеджеров! Часть 2

Подробнее о сообществе:
Карта всего контента сообщества:
Антипаттерны React    • ТОП 7 Антипаттернов React. Ошибки, которые...   Курс по паттернам:
Мой telegram канал:
Исходники:
Материалы:
В видео мы разработаем копию miro доски на чистом React без использования стейт менеджеров. Реализуем: Работу со стикерами, перемещение, зум, svg стрелки Используем паттерны State и Decorator из GOF адаптированные по современный React 00:00:00 - 00 Что будет в видео 00:01:59 - 01 Базовая вёрстка 00:07:36 - 02 Добавление ноды 00:23:59 - 03 Считываем размер и положение canvas через реф 00:31:15 - 04 Обработка горячих клавиш 00:36:25 - 05 Фокус на переключение табов 00:39:20 - 06 Выделение по клику 00:52:08 - 07 Добавляем State паттерн 01:29:37 - 08 Добавляем окно выделения 02:21:05 - 09 Рефакторинг ui 02:24:28 - 10 Считываем размеры нод через реф 02:57:07 - 11 Редактирование текста ноды 03:12:54 - 12 Автоматический размер textarea 03:22:35 - 13 Рефакторинг idle state 03:40:46 - 14 Перетаскивание стикеров 04:01:40 - 15 Перемещение карты 04:25:23 - 16 Zoom на карте 04:45:38 - 17 Отрисовка точек через css переменные 04:53:01 - 18 Отрисовка стрелок через canvas 05:11:07 - 19 Добавление стрелок в логику состояний 05:37:18 - 20 Выносим общую логику actions в декоратор 05:46:38 - 21 Рисование стрелок на карте 05:59:59 - 22 Добавление относительных точек. И поддержка стрелок 06:42:55 - 23 Что дальше