Sebastian Gomez
AboutConferencias
Feb 21, 2022

Despliegue de aplicaciones Next.js con vercel

Dependiendo de como has contruido tu aplicación podras desplegarla a una u otra parte. Por ejemplo si tu aplicación esta completamente generada como estática SSG, de esto hablamos en este post: puede usar un servidor básico que te permita mostrar archivos estáticos. Por ejemplo Firebase Hosting o Github Pages.

Para ellos basta con ejecutar el comando:

next export

Y subir la carpeta donde corresponda o construir tu propio sistema de integración continua y pipelina de despliegue.

⚠️Tip: Ten presente que si ese es tu camino deberás reescribir las rutas a peticiones que usen variables de entorno de testing, development o producción.

Sin embargo hay una manera mucho más sencilla. Vercel es la compañía detras de Next.js ellos literalmente crearon Next.js y además tienen un servicio gratuito para aplicaciones construidas con Next.js donde es solo usar un comando y desplegar tu aplicación.

Familiarizate con el sitio web de , es importante ya que allí podrás descubrir funcionalidades interesantes. Además entenderás como funciona la carpeta gratuita (Que para ser gratis es muy muy grande).

Primero instalemos Vercel como paquete global de Node:

npm i -g vercel

Luego simplemente debes ejecutar el comando:

$ vercel

En tu consola y deberá seguir los pasos.

También el sitio web puedes configurarlo desde tu repositorio de Github y hacer todo el enlace entre ambos sitios:

deploy-1.png

deploy-2.png

deploy-3.png

deploy-4.png

--

Eso es todo, espero que este post te sea de utilidad y lo puedas aplicar a algún proyecto que tengas en mente o que simplemente te haya ayudado a entender como desplegar aplicaciones de Next.js en vercel.

Déjame un comentario si te sirvió, si quieres añadir alguna opinión o si tienes alguna duda no dudes en dejarme un comentario en la parte de abajo, recuerda que si te gustó también puedes compartir usando los links a las redes sociales en la parte de abajo.

Sebastian Gomez

Sebastian Gomez

Sebastian Gomez ayuda a desarrolladores a alcanzar su máximo potencial

Leave a Reply

Related Posts

Categories