HOSTING PARA NEXT.JS

Sí, de dos formas. Para SSR, ejecuta el servidor de Next.js en cualquier hosting de Node.js (VPS, Render, Railway). Para la exportación estática, aloja los archivos HTML ya compilados donde quieras. Static.app es una de las opciones más sencillas para exportaciones estáticas: añade output: 'export' a tu configuración, ejecuta la compilación, comprime la carpeta out/ en un ZIP y súbela. Sin Docker, sin entorno de Node.js, sin gestionar procesos.

Vercel ofrece un plan gratuito para Next.js que incluye SSR y funciones serverless, con límites de ancho de banda y de uso comercial. Para exportaciones estáticas alojadas en otro sitio, Cloudflare Pages y GitHub Pages son gratuitos con limitaciones. Static.app cuesta 6 USD/mes e incluye tráfico ilimitado, formularios, analítica y protección con contraseña. La mejor opción depende de si necesitas funciones de servidor o solo quieres servir archivos HTML ya compilados.

No. Static.app solo aloja archivos ya compilados, sin entorno de servidor. En Next.js, esto significa que tienes que usar el modo de exportación estática añadiendo output: 'export' a tu next.config.js. Así se prerenderizan todas las páginas como archivos HTML durante la compilación. Si tu app depende de funciones de SSR (Server Components con obtención de datos en el servidor, ISR o middleware), necesitas Vercel u otro hosting de Node.js.

No. Las rutas de API de Next.js (el directorio /api) necesitan un servidor de Node.js en marcha para procesar las peticiones. En hosting estático no hay ningún servidor que ejecute ese código. La solución es mover la lógica de tu API a un servicio de backend aparte (Render, Railway, Supabase) y llamarlo desde tu frontend de Next.js con fetch. Para gestionar formularios sencillos, el atributo static-form de Static.app evita tener que crear una ruta de API propia.

Las rutas de API, los Server Components con obtención de datos en el servidor, ISR (Incremental Static Regeneration) y el middleware. Todas necesitan un servidor en marcha. La exportación estática genera el HTML durante la compilación.

Sí, en modo de exportación estática. Define output: 'export' en tu configuración y las funciones estáticas del App Router funcionan: layouts, rutas anidadas, estados de carga, error boundaries y rutas paralelas. Lo que no funciona en la exportación estática son las Server Actions, la obtención dinámica de datos en el servidor y el middleware. Si tu app solo usa componentes de cliente y datos estáticos, el App Router funciona perfectamente.

Sí, con generateStaticParams() en los archivos de tus rutas. Así Next.js prerenderiza durante la compilación todas las combinaciones del parámetro dinámico. Por ejemplo, un blog con /posts/[slug] genera un archivo HTML distinto para cada entrada. Las páginas resultantes son archivos estáticos que Static.app sirve como cualquier otra página HTML. Tienes que conocer todos los valores posibles del parámetro en el momento de compilar.

Sí, con un cambio de configuración. Añade images: { unoptimized: true } a tu next.config.js. Así Next.js usa etiquetas <img> estándar en lugar de su optimización de imágenes en el servidor (que necesita un servidor en marcha). Tus imágenes se siguen mostrando correctamente, pero no tendrán la conversión automática a WebP ni los tamaños adaptables que ofrece Vercel. En la mayoría de los sitios web, la diferencia en la velocidad de carga es mínima.

Sí. Tailwind CSS es una herramienta de compilación que genera un único archivo CSS optimizado durante next build. El resultado contiene solo las clases CSS que tu proyecto usa de verdad, normalmente 10-30 KB. Static.app sirve este archivo CSS como cualquier otro recurso estático. Tailwind no tiene nada que dependa del servidor.

Añade trailingSlash: true a tu next.config.js. Sin esto, Next.js genera archivos como /about.html. Con esto, el resultado pasa a ser /about/index.html. El segundo formato funciona de forma más fiable en hosting estático porque el servidor puede resolver /about/ como /about/index.html automáticamente. Además evita problemas de redirección que pueden perjudicar la velocidad de carga y el SEO.

La exportación estática admite i18n mediante enrutamiento por subrutas. Cada idioma tiene su propio conjunto de archivos HTML prerenderizados (por ejemplo, /en/about/index.html, /fr/about/index.html). Súbelos todos en tu ZIP y Static.app sirve la página correcta para cada URL. Ten en cuenta que la detección automática del idioma según la cabecera Accept-Language necesita middleware, que no funciona en la exportación estática. En su lugar tendrás que usar una redirección del lado del cliente o un selector de idioma.

Vercel es excelente para aprovechar todas las funciones de Next.js (SSR, ISR, Edge Functions). Si solo necesitas la exportación estática, Static.app es más sencillo y más barato, sin precios por usuario.

El plan gratuito de Vercel incluye SSR, Edge Functions y publicación automática desde Git, pero tiene límites de ancho de banda (100 GB), un tope de minutos de compilación y la restricción de un solo proyecto comercial. El plan de 6 USD/mes de Static.app tiene tráfico ilimitado, sin límite de minutos de compilación (compilas en local) y admite varios sitios web comerciales. Si necesitas SSR o funciones serverless, Vercel es la mejor opción. Si exportas HTML estático y quieres un hosting más sencillo e ilimitado, Static.app cuesta menos y tiene menos restricciones.