Глава 26. Динамические маршруты и состояния страниц
Зачем эта глава
В реальных проектах адреса часто содержат параметры: например, /products/42.
Мы научимся делать такие страницы и добавим состояния загрузки и ошибки.
Теория (коротко)
Динамические маршруты создаются через папки с квадратными скобками: [id].
Файлы loading.jsx и error.jsx помогают показывать состояния.
app/
products/
[id]/
page.jsx
loading.jsx
error.jsx
Важно: в динамическом маршруте ты получаешь параметры через props страницы.
Задания
Задание: динамика
- Создай маршрут /products/[id].
- Выведи ID на странице.
- Добавь файл loading.jsx.
Проверка себя
Ты умеешь создавать динамические страницы и показывать состояние загрузки.
Мини-проект
Цель: карточка товара по ID.
Требования: динамический маршрут и тестовый массив данных.
Критерий готовности: страница меняется при разных ID.
Словарь главы
- Динамический маршрут
- Маршрут с параметром, например /products/42.
- loading.jsx
- Файл для отображения состояния загрузки.