Next.js 58: Checklist de producción y despliegue
easy⏱ 5 mincoursenextjs
git push, build, deploy
Vercel observa tu repositorio conectado. Cada push a una rama construye un deployment de preview; los push a main construyen y promueven a producción. No hay servidor que aprovisionar — la plataforma detecta Next.js automáticamente y corre next build por ti, luego sirve el resultado desde su red edge.
# .env.local — never commit this file
DATABASE_URL=postgres://user:pass@host/db
NEXT_PUBLIC_API_URL=https://api.example.com
# Vercel dashboard -> Project -> Settings -> Environment Variables
# mirrors .env.local for Production / Preview / Development
Capas de caché, apiladas
Next.js en producción cachea en varios niveles a la vez: el Router Cache en el cliente evita volver a pedir páginas que ya visitaste, la Full Route Cache guarda rutas estáticas renderizadas en el servidor, la Data Cache persiste resultados individuales de fetch entre requests y deploys, y un CDN por delante de todo cachea respuestas cerca de tus usuarios. Juntas son la razón por la que una app bien configurada se siente instantánea.
Bloquea el botón de deploy
El arreglo CHECKLIST ya tiene su ítem final env, y allDone está conectado a items.every(it => it.done) para que Deploy solo se habilite cuando cada ítem esté marcado. Desmarca un ítem y confirma que Deploy se deshabilita de inmediato — luego márcalo otra vez y observa correr el pipeline.
Lo que construiste
CSS con alcance limitado, un theme global, imágenes optimizadas y fuentes autohospedadas, metadata por página (estática y dinámica), un sitemap y un robots generados, widgets pesados con código dividido, el runtime correcto por ruta, y configuración consciente del entorno — eso es una app Next.js genuinamente lista para producción. Buen trabajo llegando hasta aquí.