Логотип YeaHub

База вопросов

Собеседования

Тренажёр

База ресурсов

Обучение

Навыки

Войти

Выбери, каким будет IT завтра — вместе c нами!

YeaHub — это полностью открытый проект, призванный объединить и улучшить IT-сферу. Наш исходный код доступен для просмотра на GitHub. Дизайн проекта также открыт для ознакомления в Figma.

© 2026 YeaHub

Документы

Медиа

Назад
Вопрос про Next.js: dynamic, route, nextjs

Как реализуются динамические маршруты в Next.js?

Вопрос проверяет понимание файловой маршрутизации и работы параметров URL.

Короткий ответ

В Next.js динамические маршруты создаются с помощью файлов в квадратных скобках, например [id].js. Значение параметра можно получить через router.query или параметры функции загрузки данных. Такой подход позволяет создавать страницы для разных сущностей, например пользователей или товаров. Маршруты формируются автоматически на основе структуры файлов.

Длинный ответ

Next.js использует файловую систему для определения маршрутов, включая динамические.

Определение:
Динамический маршрут (dynamic route) — это маршрут, в котором часть URL является переменной и определяется во время выполнения.

Пример структуры

pages/
  users/
    [id].js

Такой файл обрабатывает маршруты вида:

/users/1
/users/25

Получение параметра

import { useRouter } from "next/router";

const router = useRouter();
const { id } = router.query;

Альтернативный вариант (SSR или SSG)

export async function getServerSideProps(context) {
  const { id } = context.params;
  return { props: { id } };
}

Когда используется

  1. Страницы пользователей.

  2. Страницы товаров.

  3. Детальные страницы контента.

Вывод

Динамические маршруты в Next.js реализуются через файловую систему и позволяют автоматически обрабатывать параметры URL.

Уровень

  • Рейтинг:

    5

  • Сложность:

    5

Навыки

  • Next.js

    Next.js

Ключевые слова

#dynamic

#route

#nextjs

Подпишись на React Developer в телеграм