Зачем нужен Routing в React?

Routing нужен, чтобы у экранов SPA были адреса: React-приложение живёт на одной HTML-странице, и без роутинга все «страницы» — безымянный условный рендеринг.

Что ломается без роутинга

• Ссылки: нельзя отправить коллеге адрес конкретного товара — URL всегда один.
• Перезагрузка: F5 возвращает на «главный» экран, состояние навигации теряется.
• Кнопки назад/вперёд: не работают внутри приложения (или уводят с сайта).
• SEO и аналитика: поисковикам и метрикам нечего индексировать/считать — страница одна.
• Закладки, «открыть в новой вкладке», шаринг в соцсети — всё мимо.

Роутинг возвращает SPA нормальное поведение веба.

Что даёт роутер

<Routes>
  <Route path="/orders" element={<Orders />} />
  <Route path="/orders/:id" element={<OrderDetails />} />
</Routes>

• URL ↔ UI: каждый экран адресуем; переходы без перезагрузки (History API).
• Параметры в адресе: /orders/42, ?page=3 — состояние навигации живёт в URL и переживает перезагрузку.
• Структура приложения: вложенные маршруты и layout'ы, гарды доступа, code splitting по страницам, 404.

Полезная рамка: URL как состояние

Роутинг — это вынос части состояния приложения в адресную строку: «какая страница, какой объект, какие фильтры». Такое состояние автоматически шарится, восстанавливается и попадает в историю — то, чего useState не даёт.

Коротко для собеседования

Роутинг даёт экранам SPA адреса: ссылки, перезагрузка, назад/вперёд, закладки и аналитика снова работают, а состояние «где я» живёт в URL. Плюс структурные бонусы: вложенные layout'ы, параметры, гарды, code splitting по маршрутам. Без роутера SPA — одна страница с непересылаемыми экранами.