Implementación de aplicaciones renderizadas del lado del servidor con Amplify Hosting

Puede usar… AWS Amplify para implementar y alojar aplicaciones web que utilizan la renderización del lado del servidor ()SSR. Amplify Hosting detecta automáticamente las aplicaciones creadas con el marco Next.js y no es necesario realizar ninguna configuración manual en el AWS Management Console.

Amplify también es compatible con cualquier SSR marco basado en JavaScript con un adaptador de compilación de código abierto que transforma el resultado de la compilación de una aplicación en la estructura de directorios que Amplify Hosting espera. Por ejemplo, puede implementar aplicaciones creadas con Nuxt, Astro y SvelteKit los marcos instalando los adaptadores disponibles.

Los usuarios avanzados pueden usar la especificación de despliegue para crear un adaptador de compilación o configurar un script posterior a la compilación.

Puede implementar los siguientes marcos para Amplify Hosting con una configuración mínima.

Next.js

• Amplify es compatible con las aplicaciones Next.js 14 sin necesidad de un adaptador. Para empezar, consulte Amplify el soporte para Next.js.

Nuxt.js

• Amplify admite las implementaciones de aplicaciones Nuxt.js con un adaptador preestablecido. Para empezar, consulte Amplify el soporte para Nuxt.js.

Astro.js

• Amplify admite las implementaciones de aplicaciones Astro.js con un adaptador comunitario. Para empezar, consulte Amplify el soporte para Astro.js.

SvelteKit

• Amplify admite la implementación de SvelteKit aplicaciones con un adaptador comunitario. Para empezar, consulte Amplify el soporte para SvelteKit.

Adaptadores de código abierto

• Usar un adaptador de código abierto: para obtener instrucciones sobre cómo usar cualquier adaptador que no esté en la lista anterior, consulteUso de adaptadores de código abierto.

• Cree un adaptador de marco: los autores de marcos que deseen integrar las funciones que proporciona un marco pueden usar la especificación de implementación de Amplify Hosting para configurar el resultado de la compilación de manera que se ajuste a la estructura que Amplify espera. Para obtener más información, consulte Uso de la especificación de implementación de Amplify Hosting para configurar el resultado de la compilación.

• Configura un script posterior a la compilación: puedes usar la especificación de despliegue de Amplify Hosting para manipular el resultado de la compilación según sea necesario para escenarios específicos. Para obtener más información, consulte Uso de la especificación de implementación de Amplify Hosting para configurar el resultado de la compilación. Para ver un ejemplo, consulte Implementación de un servidor Express mediante el manifiesto de implementación.

Temas

• Amplify el soporte para Next.js
• Amplify el soporte para Nuxt.js
• Amplify el soporte para Astro.js
• Amplify el soporte para SvelteKit
• Implemente una SSR aplicación para Amplify
• SSRfunciones compatibles
• Precios de las aplicaciones SSR
• Solución de problemas de SSR despliegues
• Avanzado: adaptadores de código abierto

Implemente una SSR aplicación para Amplify

Puedes usar estas instrucciones para implementar una aplicación creada con cualquier marco con un paquete de implementación que se ajuste al resultado de compilación que Amplify espera. Si va a implementar una aplicación de Next.js, no se necesita ningún adaptador.

Si vas a implementar una SSR aplicación que usa un adaptador de marco, primero debes instalar y configurar el adaptador. Para obtener instrucciones, consulte Uso de adaptadores de código abierto.

Para implementar una SSR aplicación en Amplify Hosting

1. Inicie sesión en AWS Management Console y abre la consola Amplify.

2. En la página Todas las aplicaciones, elija Crear nueva aplicación.

3. En la página Comenzar a crear con Amplify, elige tu proveedor de repositorios de Git y, a continuación, selecciona Siguiente.

4. En la página Añadir ramificación de repositorio, siga estos pasos:

   1. Selecciona el nombre del repositorio al que deseas conectarte.

   2. Seleccione el nombre de la rama del repositorio a la que desee conectarse.

   3. Elija Next (Siguiente).

5. En la página de configuración de la aplicación, Amplify detecta automáticamente las aplicaciones de Next.jsSSR.

   Si va a implementar una SSR aplicación que utiliza un adaptador para otro marco, debe habilitar Amazon CloudWatch Logs de forma explícita. Abre la sección de configuración avanzada y, a continuación, selecciona Habilitar los registros de SSR aplicaciones en la sección de implementación de Server-Side Rendering (SSR).

6. La aplicación requiere una función IAM de servicio que Amplify asume para entregar los registros a su Cuenta de AWS.

   El procedimiento para agregar un rol de servicio varía en función de si desea crear un rol nuevo o usar uno existente.

   • Para crear un nuevo rol:

     1. Elija Crear y utilizar un nuevo rol de servicio.

   • Para usar un rol existente:

     1. Elija Usar un rol existente.

     2. En la lista de funciones de servicio, seleccione la función que desee utilizar.

7. Elija Next (Siguiente).

8. En la página Revisar, elija Guardar e implementar.