React: учебный каталог
Соберём отдельное учебное приложение «Профессор Веб»: каталог текстовых карточек о HTML, CSS и JavaScript. Начнём с JSX и компонентов, затем добавим фильтр, локальную подборку, чтение API, подробную страницу и форму. Закончим созданием и удалением записей с явной обработкой ошибок и неизвестного результата.
Нужны основы HTML, CSS и JavaScript: функции, массивы, ES-модули и Promise. Все данные придуманы для примера. Это самостоятельный учебный проект, который не меняет публичную статическую библиотеку ProfessorWeb.
Компоненты и локальное состояние
- React и исходный проект
- JSX и данные карточки
- Компоненты и общие стили
- События и состояние
- Списки и React DevTools
- Props и повторное использование
- Обратные вызовы между компонентами
- Эффекты и зависимости
API и адреса экранов
- Локальный API и первая загрузка
- Загрузка, пустой список и ошибки
- Собственный хук и отмена запросов
- Маршруты и ссылки приложения
- Параметр адреса и подробная карточка
Форма и изменение данных
Материалы и выбранные версии
Скачать исходники курса. Архив содержит полные последовательные снимки lesson-01/after — lesson-16/after, удобную копию final, описания входов и ожидаемых результатов. Следующий урок начинается с предыдущего снимка; не нужно собирать проект из несогласованных фрагментов разных этапов.
Выбранный профиль: React и React DOM 19.3.0, Vite 8.3.4, @vitejs/plugin-react 6.1.2, React Router 8.4.0 в declarative mode, Node 24.21.0 LTS. Версии сверены по первичным источникам 11 октября 2026 года. Зависимости не устанавливались, lockfile не создавался. Исходники, API, браузерные сценарии, тесты и сборка не исполнялись; описанные результаты являются ожидаемыми.
С девятого урока используется собственный минимальный Node HTTP fixture на loopback. Данные хранятся в памяти и сбрасываются при перезапуске. Авторизации, базы, идемпотентности, production-развёртывания и SSR в пакете нет. Клиентская SPA не обещает поисковую полноту без отдельного серверного решения.