Desarrollo con Next.js para productos y sitios de marketing

Qué incluye nuestro desarrollo con Next.js#

Un proyecto Next.js con Dardo cubre la construcción y las decisiones que fijan su velocidad y su costo de operación más adelante. La propuesta indica cuáles de estos puntos están incluidos y cómo se aprueba cada uno.

• Un inventario de rutas que marca cada una como estática, en caché o renderizada en cada solicitud
• Una aplicación con App Router en TypeScript, con Server Components por defecto y código de navegador solo donde la interfaz lo necesite
• Reglas de caché, incluido qué se actualiza cuando tu equipo publica contenido
• Verificaciones de permisos en el código de servidor que lee los datos, con pruebas que intentan saltárselas
• Alojamiento en Vercel, Cloudflare Workers o un servidor Node.js, con despliegues de vista previa y una estimación del costo mensual
• Presupuestos de JavaScript, monitoreo de errores y eventos de analítica revisados antes del lanzamiento

¿Cuándo conviene Next.js y cuándo es mejor Astro?#

Elige Next.js cuando buena parte de lo que construyes se comporta como una aplicación: las personas inician sesión, ven sus propios datos, modifican registros o reciben páginas armadas para ellas en cada solicitud.

Elige Astro cuando la mayoría de las páginas son iguales para todos los visitantes, como en los sitios de marketing y las publicaciones; el sitio de Dardo corre en Astro, y nuestra página de desarrollo con Astro explica cuándo es la mejor opción. Si el flujo del producto todavía no está definido, empieza por definirlo con desarrollo de software a la medida, que cubre cuentas, roles y pagos. Y si marketing debe publicar sin desarrolladores, la elección del CMS headless importa tanto como la del framework.

Estática, en caché o renderizada bajo demanda: ¿cómo debe funcionar cada ruta?#

Cada ruta debería hacer el mínimo trabajo que aún muestre el contenido correcto. Una página igual para todos se genera una vez, una que cambia de vez en cuando se guarda en caché y se actualiza al publicar contenido, y solo una página que depende de quién la pide se renderiza en cada solicitud. En el App Router, las páginas son Server Components por defecto, así que el HTML sale del servidor y llega menos JavaScript al navegador.

A octubre de 2026, la versión vigente es Next.js 16.4, publicada el 6 de octubre. Recomienda Cache Components, el modelo de caché construido alrededor de la directiva use cache, para todas las aplicaciones, lo activa en los proyectos nuevos y dice que será el predeterminado en Next.js 17. Así, una página puede combinar un layout en caché con partes renderizadas por visitante, como el menú de cuenta en una página de precios estática. La versión 16.4 también añade un ajuste que hace fallar el build cuando contenido de solicitud se cuela en una ruta pensada para ser estática, de modo que un componente suelto no suma costo de servidor a las páginas de marketing sin que nadie lo note.

¿Dónde alojar una aplicación Next.js y cuánto cuesta operarla?#

Cualquier proveedor que ejecute Node.js puede correr todas las funciones de Next.js, así que el alojamiento es una decisión de costo, operación y dependencia del proveedor. A octubre de 2026, la documentación de Next.js lista a Vercel y Bun como adaptadores verificados; Cloudflare y Netlify están construyendo los suyos y mientras tanto ofrecen sus propias integraciones. Una exportación estática funciona en cualquier parte, pero pierde toda función que necesite un servidor.

Hemos corrido Next.js en las dos opciones administradas. A medio tono empezó en Vercel y pasó a Cloudflare Workers el 30 de septiembre de 2026, con Next.js 16 mediante OpenNext y un Worker frontal que sirve las páginas prerenderizadas y guarda en caché las imágenes optimizadas.

Los costos de operación cambian con las decisiones de renderizado. Más allá del crédito incluido, Vercel lista las invocaciones de funciones a USD 0,60 por millón y las transformaciones de imágenes a USD 0,05 por mil, así que una página que podría ser estática pero se renderiza por visitante cuesta dinero en cada visita. Antes del lanzamiento estimamos la factura mensual a partir del tráfico esperado y configuramos alertas de gasto en tu cuenta.

Un solo código para el producto y sus páginas de marketing#

Un solo código en Next.js puede servir las páginas públicas de un SaaS y su producto con sesión iniciada, y mantener coherentes los componentes, el estado de la sesión y la analítica. El costo es el acoplamiento: corregir una errata en la página de precios sale en la misma versión que el código del producto, por lo que mantenemos las rutas de marketing estáticas y su contenido en un CMS.

En Hyper, un único front end en Next.js 16 lleva la historia del producto con scroll y el flujo de investigación de pago que sigue; un webhook confirma cada pago y la investigación corre en un servicio aparte en Python. Si tus clientes van a usar el producto en sus propios dominios, plantéalo desde el principio con nuestra guía de dominios personalizados para SaaS.

A veces separar es mejor: un sitio de marketing en Astro o Webflow en www y la aplicación en su propio subdominio, cuando marketing publica a diario y el equipo de producto lanza con su propio calendario. Diseñar ese sitio de marketing es nuestro servicio de diseño web para SaaS.

La seguridad y las actualizaciones vienen con el framework#

Una aplicación Next.js ejecuta tu código en un servidor, así que la versión del framework es una dependencia de seguridad que necesita un responsable después del lanzamiento. El 3 de diciembre de 2025, Next.js publicó el aviso CVE-2025-66478, con calificación CVSS 10.0: una falla en el protocolo de React Server Components podía permitir la ejecución remota de código en aplicaciones con App Router y Next.js 15 o 16. No había solución alternativa: había que actualizar, y Next.js recomendó rotar los secretos.

Según la política de soporte de Next.js, la 16.x está en LTS activo y la 15.x en LTS de mantenimiento, que solo trae correcciones críticas y de seguridad, durante dos años desde el lanzamiento inicial de una versión mayor. Next.js 15 salió el 21 de octubre de 2024, así que esa ventana se cierra en octubre de 2026; la 14.x y las anteriores no tienen soporte.

Revisamos los permisos en el código de servidor que lee cada registro, no solo en la capa de rutas, y tratamos cada Server Action como un endpoint público. Cada entrega indica quién aplica las versiones de seguridad; con un plan de mantenimiento web, somos nosotros.

Retomar o actualizar una aplicación Next.js existente#

Retomamos aplicaciones Next.js tras una auditoría de versiones, enrutadores, alojamiento y facturas recientes, caché, verificaciones de permisos, tamaños de JavaScript y pruebas, que termina en una lista de correcciones priorizada y una cotización.

Salir del Pages Router no tiene por qué ser una reescritura: Next.js diseñó el directorio app para convivir con el directorio pages y permitir una migración página por página, y los codemods se encargan de parte de cada actualización. Si un sitio público cambia de plataforma en el proceso, primero van las redirecciones y la búsqueda, como en nuestro proceso de migración de página web.

Las actualizaciones reciben las mismas pruebas que las funciones nuevas. En Janus Observatory, un bucle de precarga especulativa en el stack de Next.js y OpenNext hizo 11.704 solicitudes en un solo registro fallido del navegador; lo eliminamos, y ahora las pruebas exigen cero solicitudes especulativas.

¿Cuánto cuesta el desarrollo con Next.js?#

El precio sigue lo que hacen las rutas, no cuántas páginas hay: veinte páginas de marketing con tres plantillas pueden costar menos que cinco pantallas con inicio de sesión, roles y datos en vivo. El alojamiento lo factura el proveedor a tu nombre, fuera de nuestros honorarios. Los rangos de presupuesto del formulario de contacto van de menos de 5.000 USD a más de 60.000 USD; la página de precios los lista. Esto es lo que más mueve la estimación:

• Rutas que se renderizan por visitante o por cuenta, frente a páginas estáticas
• Inicio de sesión, roles y las pruebas de permisos que los acompañan
• Integraciones: pagos, CRM, búsqueda, un CMS o tus propias API
• Idiomas, cada uno con sus URL y su revisión
• Un código existente que hay que auditar, actualizar o migrar primero

Preguntas antes de elegir#

Desde el blog#

• Sanity vs Contentful vs Payload: el mejor CMS headless para tu equipo en 2026

  Sanity, Contentful, Payload, Strapi y Storyblok comparados en hosting, vista previa, traducciones, exportación y costo mensual real para equipos de 5 y 12.

• Astro vs Next.js: cuál elegir para un sitio de marketing o un producto en 2026

  Astro para sitios iguales para todos los visitantes, Next.js para productos con sesión iniciada: renderizado, JavaScript, alojamiento y soporte comparados.