Getting Started with AWS

Build a Serverless Web Application

with AWS Lambda, Amazon API Gateway, AWS Amplify, Amazon DynamoDB, and Amazon Cognito

Build a Serverless Web Application

Introduction: Build a Serverless Web Application

Follow step-by-step instructions to create a simple serverless web application that enables users to request unicorn rides from the Wild Rydes fleet

Overview

In this tutorial, you'll create a simple serverless web application that enables users to request unicorn rides from the Wild Rydes fleet. The application will present users with an HTML based user interface for indicating the location where they would like to be picked up and will interface on the backend with a RESTful web service to submit the request and dispatch a nearby unicorn. The application will also provide facilities for users to register with the service and log in before requesting rides.

Application Architecture

The application architecture uses AWS Lambda, Amazon API Gateway, Amazon DynamoDB, Amazon Cognito, and AWS Amplify Console. Amplify Console provides continuous deployment and hosting of the static web resources including HTML, CSS, JavaScript, and image files which are loaded in the user's browser. JavaScript executed in the browser sends and receives data from a public backend API built using Lambda and API Gateway. Amazon Cognito provides user management and authentication functions to secure the backend API. Finally, DynamoDB provides a persistence layer where data can be stored by the API's Lambda function.

Serverless_Architecture
Serverless_Web_App_LP_assets-18

Static Web Hosting

AWS Amplify hosts static web resources including HTML, CSS, JavaScript, and image files which are loaded in the user's browser.

Serverless_Web_App_LP_assets-19

User Management

Amazon Cognito provides user management and authentication functions to secure the backend API.

Serverless_Web_App_LP_assets-20

Serverless Backend

Amazon DynamoDB provides a persistence layer where data can be stored by the API's Lambda function.

Serverless_Web_App_LP_assets-21

RESTful API

JavaScript executed in the browser sends and receives data from a public backend API built using Lambda and API Gateway.

 AWS Experience

Beginner

 Time to Complete

2 hours

 Cost to Complete

Each service used in this architecture is eligible for the AWS Free Tier. If you are outside the usage limits of the Free Tier, completing this tutorial will cost you less than $0.25*.

 Tutorial Prereqs

Technologies used:


*This estimate assumes you follow the recommended configurations throughout the tutorial and terminate all resources within 24 hours.
**Accounts that have been created within the last 24 hours might not yet have access to the resources required for this tutorial.

Modules

This workshop is divided into five modules. Each module describes a scenario of what we're going to build and step-by-step directions to help you implement the architecture and verify your work. 

  1. Host a Static Website (15 minutes): Configure AWS Amplify to host the static resources for your web application with continuous deployment built-in
  2. Manage Users (30 minutes): Create an Amazon Cognito user pool to manage your users' accounts
  3. Build a Serverless Backend (30 minutes): Build a backend process for handling requests for your web application
  4. Deploy a RESTful API (15 minutes): Use Amazon API Gateway to expose the Lambda function you built in the previous module as a RESTful API
  5. Terminate Resources (10 minutes):  Terminate all the resources you created throughout this tutorial

Host a Static Website