Routing y Navegación en Next.js
Dynamic routes, route groups, parallel routes, intercepting routes, useRouter, Link, redirect
1¿Cuál es la sintaxis para crear una ruta dinámica en Next.js App Router?
¿Cuál es la sintaxis para crear una ruta dinámica en Next.js App Router?
Respuesta
Las rutas dinámicas en Next.js App Router usan corchetes para definir segmentos de URL variables. Por ejemplo, [id] crea una ruta que captura cualquier valor en esa posición de la URL. Este valor es accesible a través de los parámetros de la página. Esta convención permite crear páginas genéricas que se adaptan a diferentes contenidos sin crear archivos separados para cada variación.
2¿Cuál es el rol principal del componente Link en Next.js?
¿Cuál es el rol principal del componente Link en Next.js?
Respuesta
El componente Link es el elemento de navegación recomendado en Next.js. Precarga automáticamente las rutas visibles en el viewport y permite la navegación del lado del cliente sin recargas completas de página. A diferencia de una etiqueta a estándar, Link mantiene el estado de la aplicación y proporciona transiciones fluidas entre páginas, mejorando significativamente la experiencia de usuario y el rendimiento.
3¿Cómo acceder a los parámetros de una ruta dinámica en un Server Component?
¿Cómo acceder a los parámetros de una ruta dinámica en un Server Component?
Respuesta
En Next.js App Router, los Server Components reciben automáticamente un objeto params que contiene los segmentos dinámicos de la URL. Este objeto se pasa como prop a la función del componente. Por ejemplo, para una ruta [id], params.id contendrá el valor capturado. Este enfoque simplifica el acceso a los parámetros sin necesidad de hooks del lado del cliente.
¿Cuál es la principal ventaja de los route groups en Next.js?
¿Cuál es la diferencia entre useRouter y usePathname?
+19 preguntas de entrevista
Otros temas de entrevista React / Next.js
Fundamentos de JavaScript
Fundamentos de React
React Hooks
Ciclo de vida de los componentes
React Router
Gestión de estado con Context
Formularios y Controlled Components
Obtención de datos y API
React Query (TanStack Query)
Styling & CSS-in-JS
Fundamentos de Next.js
TypeScript con React
Data Fetching en Next.js
Server Actions de Next.js
API Routes de Next.js
Metadata & SEO en Next.js
Middleware y Auth en Next.js
Testing en React
Zustand State Management
Optimización de Rendimiento en React
Error Boundaries & Error Handling
Advanced React Patterns
Características avanzadas de Next.js
Despliegue y Producción de Next.js
Architecture & Design Patterns
React Server Components
Internacionalización de Next.js
React Security & Buenas Prácticas
Domina React / Next.js para tu próxima entrevista
Accede a todas las preguntas, flashcards, tests técnicos, ejercicios de code review y simuladores de entrevista.
Empieza gratis