heroku nextjs

Next.js en Heroku

Implemente aplicaciones web universales basadas en React en Heroku.

Despliegue de demostración de este repositorio:
https://nextjs.eokuapp.com

Se admite un servidor de nodo/expreso personalizado . Úselo para:

• Combinar una API de nodo con una ui siguiente/react
• Implementar rutas de URL personalizadas

▶ ️ Siguiente con el servidor Express personalizado

Requerimiento

• Heroku
  • Herramientas de línea de comandos (CLI)
  • una cuenta gratuita
• git
• Nodo.js
• Next.js

Despliegue de producción

Una vez que tenga una próxima aplicación que funcione localmente, puede implementarla para acceso público.

1. Revise el script npm start para establecer el $PORT oyente web:

   Fusionar esta entrada en paquete.json :

   {
     "scripts" : {
       "dev" : " next " ,
       "build" : " next build " ,
       "start" : " next start -p $PORT "
     }
   }

   ️ En marzo de 2019, Heroku comenzó a ejecutar npm run build automáticamente, por lo que ya no se requiere la vieja entrada de guiones heroku-postbuild .

2. Asegúrese de que la aplicación sea un repositorio GIT, ignorando los directorios de solo locales:

   git init
   (echo node_modules/ && echo .next/) >> .gitignore

3. Crea la aplicación Heroku:

   heroku create $APP_NAME

4. Desplegar:

   git add .
   git commit -m ' Next.js app on Heroku '
   git push heroku main 

   ️ En julio de 2020, Heroku apoya git push heroku main y fomenta su uso. El soporte para el nombre de la rama de 'Master' permanecerá disponible para la compatibilidad hacia atrás.

5. ♻️ Implementar cambios: Agregar, comprometer y presionar nuevamente.

Configuración personalizada

A continuación, admite la configuración de compilación y tiempo de ejecución a través del archivo next.config.js.

Use variables de entorno (Heroku Config Vars) dentro de sus componentes React, ¡no se requieren reconstrucciones! Simplemente establezca los valores Next.Config.JS desde el entorno del servidor utilizando process.env Object.