Чему вы научитесь
- 🔍 Читать исходный код React — находить, где создаётся Fiber-узел, где хранится состояние, как работает согласование
- 🧠 Объяснять, почему декларативный подход вытеснил императивный — на конкретных примерах, а не абстракциях
- 🔮 Предсказывать поведение компонентов при перерисовке — без угадывания и экспериментов методом тыка
- 🎯 Отвечать на вопросы технического собеседования про useState, ключи, Reconciliation и Fiber на уровне реализации
- ⚙️ Различать фазу отрисовки (Render) и фазу фиксации (Commit) — и понимать, что это означает для производительности
- 🏗️ Строить ментальную модель React, опираясь на исходный код, а не на статьи блогеров
О курсе
⚠️ Обязательное условие
Курс построен на коде из книги «Создание фронтенд-фреймворка с нуля» Орбайсета А. Без неё вы усвоите только верхний слой — зачем нужен React и как он устроен в общих чертах. Глубина — в исходном коде, который объясняет книга.
Не записывайтесь на курс без книги!
Доступные издания:
- 🇷🇺 Русский перевод — «Создание фронтенд-фреймворка с нуля», издательство «Питер»
- 🇬🇧 «Build a Frontend Web Framework (From Scratch)» (Manning)
- 🇬🇧 «Building Your Own JavaScript Framework» (Packt)
«Грокаем React» — системное исследование внутреннего устройства React. Не руководство по хукам и компонентам, а разбор механики: как библиотека работает изнутри и почему именно так.
Часть I: Путь к React
На сквозном примере конфетной лавки автор проведёт вас от чистого JavaScript и jQuery к идее «интерфейс как функция от состояния». Вы увидите, как императивный подход ломается при росте проекта и почему декларативная отрисовка — не тренд, а инженерное решение конкретных проблем.
- Веб до React: состояние в DOM, двунаправленный поток данных, императивный код
- jQuery: почему он не решил архитектурных проблем
- Первый шаг к React: источник правды в данных, а не в HTML
Часть II: React под капотом
Каждую идею автор покажет сначала в упрощённом учебном фреймворке fe-fwk-ts-react (адаптация кода из книги — переписана на TypeScript, приближена к архитектуре настоящего React), а затем докажет ссылкой на исходный код библиотеки.
- Виртуальное дерево — что такое
ReactElementи почему это следствие декларативности, а не оптимизация скорости - Fiber-узел — где хранится состояние между перерисовками и как это связано с хуками
- Алгоритм согласования — два условия, которые определяют всё: тег и ключ
- Ключи — почему это не рекомендация, а механизм идентификации состояния
- Фазы Render и Commit — как React разделяет вычисление и применение изменений к DOM
- Жизненный цикл компонента и планировщик на микрозадачах
Для кого этот курс
Начальные требования
- ✅ Рабочий опыт с React — писали компоненты и хуки в реальных проектах, знакомы с состоянием и свойствами
- ✅ Уверенное знание JavaScript — замыкания, прототипы, асинхронность, массивы и объекты
- ✅ Прочитана книга «Создание фронтенд-фреймворка с нуля» (или англоязычный аналог) — обязательно ⚠️
- ✅ Готовность разбирать сложные темы и читать исходный код без упрощений
TypeScript встречается в примерах, но не является предметом изучения. Базовое знакомство с TS будет плюсом.
Наши преподаватели
Как проходит обучение
📹 Видеоуроки с разбором механизмов React на инженерном языке — с исходным кодом, без воды
📝 Текстовые материалы со ссылками на исходный код и спецификации — можно перечитывать и возвращаться к конкретным местам
💬 Комментарии к урокам — задавайте вопросы напрямую автору, автор отвечает на все комментарии
🔓 Несколько уроков открыты бесплатно — посмотрите до записи и убедитесь, что формат подходит
⏱️ Без дедлайнов — проходите в своём темпе, доступ бессрочный
Программа курса
Сертификат
Что вы получаете
- 🧠 Ментальная модель React — не набор правил, которые нужно запомнить, а понимание механики. После курса вы предсказываете поведение компонентов, а не угадываете
- 💼 Готовность к техническому собеседованию — умеете объяснить Fiber, алгоритм согласования, ключи и хуки на уровне реализации
- ♾️ Бессрочный доступ ко всем материалам курса