Introducción a AWS

Crear una aplicación web sin servidor

con AWS Lambda, Amazon API Gateway, AWS Amplify, Amazon DynamoDB y Amazon Cognito

Introducción: cree una aplicación web sin servidor

Siga las instrucciones paso a paso para crear una sencilla aplicación web sin servidor que permita a los usuarios solicitar paseos en unicornio de la flota de Wild Rydes

Información general

En este tutorial, creará una sencilla aplicación web sin servidor que permite a los usuarios solicitar paseos en unicornio de la flota de Wild Rydes. La aplicación otorgará a los usuarios una interfaz de usuario basada en HTML para indicar la ubicación en la que desean que se los recoja y, también, interactuará con un servicio web RESTful en el backend para enviar la solicitud y un unicornio cercano. La aplicación también permitirá a los usuarios registrarse en el servicio e iniciar sesión antes de solicitar paseos.

Requisitos previos

Para completar este tutorial, necesitará una cuenta de AWS, la AWS CLI instalada, una cuenta con ArcGIS para agregar mapas a la aplicación, un editor de texto y un navegador web. Si aún no tiene una cuenta de AWS, puede seguir la guía de introducción Configuración de un entorno de AWS para obtener una descripción general rápida.

Arquitectura de aplicaciones

La arquitectura de la aplicación utiliza AWS Lambda, Amazon API Gateway, Amazon DynamoDB, Amazon Cognito y la consola de AWS Amplify. La consola de Amplify proporciona una implementación continua y el alojamiento de los recursos web estáticos, incluidos los archivos HTML, CSS, JavaScript y de imagen que se cargan en el navegador del usuario. JavaScript ejecutado en el navegador envía y recibe datos de una API de backend pública creada mediante Lambda y API Gateway. Amazon Cognito proporciona funciones de administración y autenticación de usuarios para proteger la API de backend. Finalmente, DynamoDB proporciona una capa de persistencia donde los datos se pueden almacenar mediante la función Lambda de la API.

Alojamiento web estático

AWS Amplify aloja recursos web estáticos como HTML, CSS, JavaScript y archivos de imagen que se cargan en el navegador del usuario.

Administración de usuarios

Amazon Cognito proporciona funciones de administración y autenticación de usuarios para proteger la API de backend.

Backend sin servidor

Amazon DynamoDB proporciona una capa de persistencia donde los datos se pueden almacenar mediante la función Lambda de la API.

API RESTful

JavaScript ejecutado en el navegador envía y recibe datos de una API de backend pública creada mediante Lambda y API Gateway.

 Experiencia en AWS

Principiante

 Tiempo de realización

2 horas

 Costo de realización

Cada servicio utilizado en esta arquitectura cumple los requisitos del nivel gratuito de AWS. Si supera los límites de uso del nivel gratuito, completar este tutorial costará menos de 0,25 USD*.

 Requisitos

Tecnologías utilizadas:


* En esta estimación se supone que se siguen las configuraciones recomendadas a lo largo del tutorial y que se terminan todos los recursos en 24 horas.
** Es posible que las cuentas que se hayan creado en las últimas 24 horas aún no tengan acceso a los recursos necesarios para este tutorial.

 Última actualización

5 de septiembre de 2023

Módulos

Este tutorial está dividido en cinco módulos. En cada módulo se describe un escenario sobre lo que se va a crear y se proporcionan instrucciones paso a paso para ayudarlo a implementar la arquitectura y verificar su trabajo. 

  1. Alojar un sitio web estático (15 minutos): configure AWS Amplify para alojar los recursos estáticos para la aplicación web con implementación continua incorporada.
  2. Administrar usuarios (30 minutos): cree un grupo de usuarios de Amazon Cognito para administrar las cuentas de los usuarios.
  3. Cree un backend sin servidor (30 minutos): cree un proceso de backend para manejar las solicitudes de la aplicación web
  4. Implementar una API RESTful (15 minutos): utilice Amazon API Gateway para exponer la función de Lambda que creó en el módulo anterior como una API RESTful.
  5. Terminar los recursos (10 minutos): termine todos los recursos creados durante este tutorial.

¿Le resultó útil esta página?

Aloje un sitio web estático