Las traducciones son generadas a través de traducción automática. En caso de conflicto entre la traducción y la version original de inglés, prevalecerá la version en inglés.
Introducción a Amplify Hosting
Para ayudarte a entender cómo funciona Amplify Hosting, este tutorial te explica cómo crear e implementar una aplicación Next.js desde un repositorio de Git.
Temas
Requisitos previos
Antes de comenzar este tutorial, complete los siguientes requisitos previos.
- Inscríbase en una Cuenta de AWS
-
Si aún no es AWS cliente, debe crear una Cuenta de AWS
siguiendo las instrucciones en línea. Al registrarte, podrás acceder a Amplify y a otros AWS servicios que puedes usar con tu aplicación. - Crear una aplicación
Cree una aplicación básica de Next.js para utilizarla en este tutorial, siguiendo las create-next-app
instrucciones de la documentación de Next.js. - Crear un repositorio de Git
-
Amplify admite GitHub Bitbucket y. GitLab AWS CodeCommit Envía tu
create-next-app
aplicación a tu repositorio de Git.
Paso 1: Conectar un repositorio de Git
En este paso, conectas tu aplicación Next.js en un repositorio de Git a Amplify Hosting.
Para conectar una aplicación a un repositorio de Git
-
Abra la consola de Amplify
. -
Si vas a implementar tu primera aplicación en la región actual, de forma predeterminada empezarás desde la página de AWS Amplifyservicio.
Selecciona Crear nueva aplicación en la parte superior de la página.
-
En la página Comenzar a crear con Amplify, elige tu proveedor de repositorios de Git y, a continuación, selecciona Siguiente.
En el GitHub caso de los repositorios, Amplify utiliza GitHub la función Aplicaciones para autorizar el acceso de Amplify. Para obtener más información sobre la instalación y la autorización de la GitHub aplicación, consulte. Configurar el acceso de Amplify a repositorios de GitHub
nota
Tras autorizar la consola de Amplify con Bitbucket GitLab, o AWS CodeCommit Amplify obtiene un token de acceso del proveedor del repositorio, pero no lo almacena en los servidores. AWS Amplify obtiene acceso a su repositorio utilizando claves de implementación instaladas solo en un repositorio específico.
-
En la página Añadir ramificación de repositorio, siga estos pasos:
-
Selecciona el nombre del repositorio al que deseas conectarte.
-
Seleccione el nombre de la rama del repositorio a la que desee conectarse.
-
Elija Siguiente.
-
Paso 2: Confirme la configuración de compilación
Amplify detecta automáticamente la secuencia de comandos de compilación que se deben ejecutar en la rama que se está implementando. En este paso, revisas y confirmas la configuración de compilación.
Para confirmar la configuración de compilación de una aplicación
-
En la página de configuración de la aplicación, busca la sección Configuración de compilación.
Compruebe que el comando de compilación de Frontend y el directorio de salida de Build sean correctos. Para esta aplicación de ejemplo de Next.js, el directorio de salida de Build está establecido en.
.next
-
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:
-
Elija Crear y utilizar un nuevo rol de servicio.
-
-
Para usar un rol existente:
Elija Usar un rol existente.
-
En la lista de funciones de servicio, seleccione la función que desee utilizar.
-
-
Elija Siguiente.
Paso 3: implementación de la aplicación
En este paso, implementas tu aplicación en la red AWS global de entrega de contenido (CDN).
Para guardar e implementar una aplicación
-
En la página de revisión, confirma que los detalles del repositorio y la configuración de la aplicación son correctos.
-
Elija Guardar e implementar. La creación de la interfaz de usuario suele tardar entre 1 y 2 minutos, pero puede variar según el tamaño de la aplicación.
-
Cuando se complete la implementación, podrás ver tu aplicación mediante el enlace al dominio
amplifyapp.com
predeterminado.
nota
Para aumentar la seguridad de las aplicaciones de Amplify, el dominio amplifyapp.com se ha registrado en la lista de sufijos públicos (PSL)__Host-
si alguna vez necesita configurar cookies confidenciales en el nombre de dominio predeterminado de las aplicaciones de Amplify. Esta práctica le ayudará a proteger su dominio de los intentos de falsificación de solicitudes entre sitios (CSRF). Para obtener más información, consulte la página de configuración de cookies
Paso 4: (opcional) limpiar los recursos
Si ya no necesitas la aplicación que implementaste para el tutorial, puedes eliminarla. Este paso le permite asegurarse de que no se le cobre por los recursos que no vaya a utilizar.
Para eliminar una aplicación
-
En el menú de configuración de la aplicación del panel de navegación, selecciona Configuración general.
-
En la página de configuración general, seleccione Eliminar aplicación.
En la ventana de confirmación, ingresa
delete
. A continuación, selecciona Eliminar aplicación.
Agrega funciones a tu aplicación
Ahora que tiene una aplicación implementada en Amplify, puede explorar algunas de las siguientes funciones que están disponibles para su aplicación alojada.
- Variables de entorno
Las aplicaciones suelen necesitar información de configuración en tiempo de ejecución. Estas configuraciones pueden ser detalles de conexión a la base de datos, claves de API o parámetros. Las variables de entorno proporcionan una forma de exponer estas configuraciones en el momento de la compilación. Para obtener más información, consulte Variables de entorno.
- Dominios personalizados
En este tutorial, Amplify aloja tu aplicación en el
amplifyapp.com
dominio predeterminado con una URL como.https://branch-name.d1m7bkiki6tdw1.amplifyapp.com
Si conecta su aplicación a un dominio personalizado, los usuarios verán que su aplicación está alojada en una URL personalizada, comohttps://www.example.com
. Para obtener más información, consulta Cómo configurar dominios personalizados.- Vista previa de una solicitud de extracción
Las vistas previas de las solicitudes de extracción web ofrecen a los equipos una forma de previsualizar los cambios de las solicitudes de extracción (PR) antes de fusionar el código con una rama de producción o integración. Para obtener más información, consulta las vistas previas web de las solicitudes de extracción de datos.
- Administrar varios entornos
Para saber cómo Amplify trabaja con las ramas de funciones y los GitFlow flujos de trabajo para admitir múltiples implementaciones, consulte Implementaciones de ramas de funciones y flujos de trabajo de equipo.