Основы Next.js
Next.js — React-фреймворк для SSR, SSG и CSR. Разбираем что такое Next.js, ключевые возможности, отличия от CRA и когда его стоит использовать.
useRouter в Next.js — программная навигация
Разбираем хук useRouter в Next.js — программные переходы через push/replace, чтение параметров маршрута, различия между App Router и Pages Router, usePathname и useSearchParams.
next/link — навигация в Next.js
Разбираем компонент Link из next/link в Next.js — клиентская навигация, prefetching, параметры href, replace, scroll, prefetch и работа с динамическими маршрутами.
next/image — оптимизация изображений в Next.js
Разбираем компонент next/image в Next.js — автоматическая оптимизация, lazy loading, форматы WebP/AVIF, параметры fill и priority, локальные и удалённые изображения.
next/font — подключение и оптимизация шрифтов в Next.js
Разбираем next/font в Next.js — автоматическая оптимизация шрифтов, подключение Google Fonts без утечки данных, локальные шрифты, CSS-переменные и предотвращение FOUT.
Metadata API в Next.js 13+ — SEO-метаданные в App Router
Разбираем Metadata API в Next.js 13 App Router — статические и динамические метаданные, title.template, Open Graph, Twitter Card, robots, canonical и generateMetadata.