MENU

Fun & Interesting

Продвинутая навигация с React Router: "Назад" с внешних ссылок, ленивая загрузка и ScrollRestoration

Video Not Working? Fix It Now

В этом видео мы улучшаем навигацию в React-приложении при помощи React Router! Реализуем продвинутую кнопку "Назад" с учётом переходов с внешних ресурсов, добавляем ленивую загрузку страниц (lazy loading) для оптимизации, обрабатываем ошибки с помощью ErrorBoundary и настраиваем сброс скролла с ScrollRestoration. Код, шаги и объяснения — всё внутри! Подписывайся, если хочешь больше уроков по React и фронтенду! Репа проекта: https://github.com/Salimov-dev/browser-router-advanced Мой ТГ: https://t.me/Rogooo Мой канал на rutube: https://rutube.ru/channel/28468267 00:00 Вступление 00:40 Клонирование проекта 01:30 Быстро знакомимся с кодом 05:56 Блокируем возврат на внешнюю ссылку 12:52 Выносим кнопку "Назад" в App 16:00 Дорабатываем handleGoBack с document.referrer 18:50 Возврат на определенную страницу fromPath 23:30 Учимся работа со скроллом 26:14 Подключаем ленивую загрузку LazyLoading 29:42 Подлючаем ErrorBoundary 35:00 Моделируем ошибку загрузки страницы 40:17 Фикс бага у скролла с помощью scrollRestoration 43:00 Конец

Comment