Building & Deploying Serverless Web Application over AWS CLOUD

🚨Disclaimer:

Reading this blog, attempting to understand the content or (heaven forbid) trying to practice it on your own, may severely disrupt your 🤯 mental peace and give you trauma. Proceed with caution, a sturdy helmet and a healthy dose of luck(- good preferred).

Warning: Performing these AWS projects on your own and misconfiguring services could lead to unexpected and real billing of Money. Remember, the cloud is not just a fluffy metaphor; it can rain bills too!!🌩️️️

Overview

In this project, you will create a serverless web application that allows users to request unicorn rides from the Wild Rydes fleet. The application will feature an HTML, CSS and JAVASCRIPT-based user interface for selecting a pick-up location and a RESTful web service backend to handle the ride requests. Additionally, the application will include user registration and login capabilities.

Prerequisites

To complete this project, you will need:

• An AWS account
• AWS CLI installed
• An ArcGIS account for mapping integration
• A text editor
• A web browser

If you don’t already have an AWS account, you can follow the Setting Up Your AWS Environment getting started guide for a quick overview.

Application Architecture

The application architecture leverages several AWS services:

• AWS Lambda: Executes backend code in response to events.
• Amazon API Gateway: Provides a RESTful API interface for the backend.
• Amazon DynamoDB: Serves as a persistence layer for storing data.
• Amazon Cognito: Manages user authentication and authorization.
• AWS Amplify Console: Hosts the static web resources and provides continuous deployment.

AWS Experience

• Time to complete: depends on individual expertise.
• Cost to complete: Less than $0.25* (eligible for the AWS Free Tier) *This estimate assumes you follow the recommended configurations throughout the project and terminate all resources within 24 hours.

Technologies Used

• AWS account**
• AWS CLI
• ArcGIS account
• Text editor
• Recommended browser: The latest version of Chrome
• AWS Lambda
• Amazon API Gateway
• AWS Amplify
• Amazon DynamoDB
• Amazon Cognito

Note-Accounts created within the last 24 hours might not yet have access to the resources required for this project.

Modules

This project is divided into five modules. Each branch describes a specific part of the application and provides step-by-step instructions to implement and verify your work.

1. Host a Static Website

Configure AWS Amplify to host the static resources for your web application with continuous deployment. AWS Amplify hosts static web resources, including HTML, CSS, JavaScript, and image files, which are loaded in the user’s browser.

2. Manage Users

Create an Amazon Cognito user pool to manage your users’ accounts. Amazon Cognito manages user authentication and authorization to secure the backend API.

3. Build a Serverless Backend

Build a backend process for handling requests from your web application. Amazon DynamoDB provides a persistence layer where data is stored by the API’s Lambda function.

4. Deploy a RESTful API

Use Amazon API Gateway to expose the Lambda function as a RESTful API. JavaScript executed in the browser communicates with the backend API, built using Lambda and API Gateway, to send and receive data.

5. Terminate Resources

Terminate all the resources you created throughout this project. My favourite part of the project, most relaxing, most satisfying.

By the end of this project, you will have a fully functional serverless web application hosted on AWS, complete with user management, a dynamic backend, and a RESTful API. This comprehensive guide ensures you can build and deploy a serverless web application efficiently and cost-effectively.

Demonstration video-

Module 1: Static Web Hosting with Continuous Deployment

Overview

In this module, you will configure AWS Amplify to host the static resources for your web application with continuous deployment built in. The Amplify Console provides a git-based workflow for continuous deployment and hosting of full-stack web apps. In subsequent modules, you will add dynamic functionality using JavaScript to call remote RESTful APIs built with Lambda and API Gateway.

Architecture Overview

All of your static web content, including HTML, CSS, JavaScript, images, and other files, will be managed by AWS Amplify Console. Your end users will access your site using the public website URL exposed by AWS Amplify Console.

Services Used

• AWS Amplify

Implementation

This web application can be deployed in any AWS Region that supports all the services used in this application, which include AWS Amplify, AWS CodeCommit, Amazon Cognito, AWS Lambda, Amazon API Gateway, and Amazon DynamoDB.

You can refer to the AWS Regional Services List to see which regions support these services. Some supported regions include:

• US East (N. Virginia)
• US East (Ohio)
• US West (Oregon)
• EU (Frankfurt)
• EU (Ireland)
• EU (London)
• Asia Pacific (Tokyo)
• Asia Pacific (Seoul)
• Asia Pacific (Sydney)
• Asia Pacific (Mumbai)

Select your region from the dropdown in the upper right corner of the AWS Management Console.

Steps to Configure AWS Amplify

Step 1: Create a Code Repository

1. Open the AWS CodeCommit console.
2. Choose Create Repository.
3. Enter wildrydes-site for the Repository name.
4. Choose Create.

Step 2: Set Up IAM User with Git Credentials

1. Set up an IAM user with Git credentials in the IAM console. Follow the instructions for HTTPS users using Git credentials.
2. Create Access keys in the IAM > Security Credentials tab. Download the Access Key and Secret Access Key IDs or copy and save them in a secure location.
3. Generate HTTPS Git credentials for AWS CodeCommit. Download or save these generated credentials as well.

Step 3: Configure AWS CLI

1. Open a terminal window.
2. Enter the command: aws configure.
3. Enter the AWS Access Key ID and Secret Access Key you created.
4. For Default region name, enter the region you initially selected to create your CodeCommit repository.
5. Leave Default output format blank, and press enter.

Example:

% aws configure
AWS Access Key ID [****************]: #####################
AWS Secret Access Key [****************]: ###################
Default region name [us-east-1]: us-east-1
Default output format [None]:

Step 4: Set Up Git Config Credential Helper

1. If you have a Linux, macOS, or UNIX machine, use the following commands:

git config --global credential.helper '!aws codecommit credential-helper $@' 
git config --global credential.UseHttpPath true

2.If you have a Windows machine, refer to the instructions for Windows.

Step 5: Clone the Repository

1. Navigate back to the AWS CodeCommit console and select the wildrydes-site repository.
2. Select Clone HTTPS from the Clone URL dropdown to copy the HTTPS URL.
3. In your terminal window, run:

git clone <HTTPS URL>

Example:

git clone https://git-codecommit.us-east-1.amazonaws.com/v1/repos/wildrydes-site

4.Enter the HTTPS Git credentials you generated.

Step 6: Copy Website Content from S3

1. Change directory into your repository:

cd wildrydes-site

1. Copy the static files from S3:

aws s3 cp s3://wildrydes-us-east-1/WebApplication/1_StaticWebHosting/website ./ --recursive

1. Add, commit, and push the git files:

git add . 
git commit -m "new files" 
git push

Deploy the Website with AWS Amplify

1. Launch the AWS Amplify console.
2. Choose Get Started under the Amplify Hosting section.
3. On the Get started with Amplify Hosting page, select AWS CodeCommit and choose Continue.
4. On the Add repository branch step, select wildrydes-site from the dropdown.
5. In the Branch dropdown, select master and choose Next.
6. On the Build settings page, leave all the defaults and choose Next.
7. On the Review page, select Save and deploy.

The process will take a couple of minutes for the Amplify Console to create the necessary resources and deploy your code. Once completed, you can select the site image or the link underneath the thumbnail to launch your Wild Rydes site.

Continuous Deployment

AWS Amplify Console will rebuild and redeploy the app when it detects changes to the connected repository. To test this process:

1. On your local machine, navigate to the wildrydes-site folder and open the index.html file in a text editor.
2. Modify the title line with the following text:

<title>Wild Rydes - Rydes of the Future!</title>

3. Save the file.

4. In your terminal window, add, commit, and push the change to the git repository:

git add index.html  
git commit -m "updated title" 
git push

Once Amplify has completed the re-deployment, re-open the Wild Rydes site and notice the tab title change.

Conclusion

In this module, you’ve created a static website which will be the base for our Wild Rydes business. AWS Amplify Console can deploy static websites following a continuous integration and delivery model. It has the capability to build more complicated JavaScript framework-based applications and features such as feature branch deployments, easy custom domain setup, instant deployments, and password protection.

Module 2: Manage Users

In this module, you’ll create an Amazon Cognito user pool to manage your users’ accounts. This includes enabling customers to register, verify their email addresses, and sign in to the site.

Architecture Overview

1. User Registration:- Users register a new account with an email address and password.
2. Email Confirmation:- After registration, Amazon Cognito sends a confirmation email with a verification code.
3. Account Confirmation:- Users confirm their account using the verification code via the site or through manual confirmation in the Cognito console.
4. User Sign-In:- Once confirmed, users can sign in.
5. Authentication:- A JavaScript function authenticates users via Amazon Cognito using SRP and receives JWTs. The JWTs authenticate users against a RESTful API built with Amazon API Gateway.

Services Used

• Amazon Cognito

Implementation Steps

1. Create a User Pool in Amazon Cognito

• Go to the Amazon Cognito console.
• Choose “Create user pool.”

2. Configure Sign-In Experience

• In the Cognito user pool sign-in options, select “User name.” Keep the defaults for other settings.
• Click “Next.”

3. Configure Security Requirements

• Keep the Password policy mode as Cognito defaults.
• Optionally configure MFA or choose “No MFA.”
• Click “Next.”

4. Configure Sign-Up Experience

• Keep all settings as default.
• Click “Next.”

5. Configure Message Delivery

• Ensure “Send email with Amazon SES — Recommended” is selected.
• In the “FROM email address” field, select a verified email address in the same region.
• Click “Next.”

6. Integrate Your App

• Name your user pool “WildRydes.”
• Name the initial app client “WildRydesWebApp” and keep other settings as default.
• Click “Next.”

7. Review and Create

• Review the settings and click “Create user pool.”

8. Save User Pool and App Client IDs

• Copy the User Pool ID and Client ID from the User pool overview and App clients and analytics sections.

9.Update Configuration in Your App

• Open the wildryde-site/js/config.js file.
• Update the cognito section with your User Pool ID, App Client ID, and Region.

window._config = {
  cognito: {
  userPoolId: 'your_user_pool_id', // e.g. us-west-2_uXboG5pAb
  userPoolClientId: 'your_app_client_id', // e.g. 25ddkmj4v6hfsfvruhpfi7n4hv
  region: 'your_region' // e.g. us-west-2     
},     
  api: {         invokeUrl: '' // e.g. https://rc7nyt4tql.execute-api.us-west-2.amazonaws.com/prod',
 }
};

Push Changes to Amplify Console

• In your terminal, add, commit, and push the updated config.js file.

$ git add . 
$ git commit -m "Update config with Cognito settings" 
$ git push

Validate the Implementation

• Navigate to the wildryde-site folder on your local machine.
• Open register.html or click the "Giddy Up!" button on the homepage.
• Complete the registration form and click “Let’s Ryde.”

1. Confirm User Account

• Using Email: Enter the verification code sent to your email on the /verify.html page.
• Manual Confirmation:
• In the Cognito console, select the user pool.
• In the “Users” tab, select the username and confirm the account through the “Actions” dropdown.

2. Sign In

• Visit /signin.html and log in with the registered email and password.
• You should be redirected to /ride.html and see a notification about the API not being configured.

Important Notes

• Ensure that the email verification may end up in the spam folder.
• Configure your user pool to use Amazon SES for sending emails from a domain you own for real deployments.
• Save the auth token from the successful authentication for the next module where you will create the Amazon Cognito user pool authorizer.

This module helps you set up a user management system using Amazon Cognito, which is a crucial part of developing modern web applications with secure user authentication and registration.

Module 3: Serverless Service Backend

Overview

In this module, you’ll use AWS Lambda and Amazon DynamoDB to create a backend for handling requests from your web application. The application allows users to request a unicorn to be dispatched to their location. The backend process involves invoking a Lambda function to select a unicorn, record the request in a DynamoDB table, and respond with details.

Architecture Overview

• User Request: A Lambda function is invoked each time a user requests a unicorn.
• Record Request: The function selects a unicorn, records the request in a DynamoDB table, and responds with unicorn details.
• API Gateway Integration: The browser invokes the Lambda function via Amazon API Gateway, which will be implemented in the next module.

Services Used

• AWS Lambda
• Amazon DynamoDB

Implementation Steps

1. Create a DynamoDB Table

1. Open the DynamoDB Console: Navigate to the Amazon DynamoDB console.
2. Create a Table:

• Table Name: Rides
• Partition Key: RideId (String)

3. Default Settings: Ensure Default settings is selected and create the table.

4. Copy ARN: Once the table is active, copy the ARN from the Overview tab > General Information section.

2. Create an IAM Role for Lambda Function

1. Open the IAM Console: Navigate to the IAM console.
2. Create Role:

• Trusted Entity Type: AWS service
• Use Case: Lambda

3. Attach Policy:

• Policy: AWSLambdaBasicExecutionRole
• Role Name: WildRydesLambda

4. Add Inline Policy:

• Service: DynamoDB
• Action: PutItem
• Resource: Specific ARN (use the ARN from the DynamoDB table)
• Policy Name: DynamoDBWriteAccess

3. Create a Lambda Function

1. Open the Lambda Console: Navigate to the AWS Lambda console.
2. Create a Function:

• Function Name: RequestUnicorn
• Runtime: Node.js 16.x
• Execution Role: Use existing role (WildRydesLambda)

3. Code Implementation:

• Replace the code in the editor with the following:

const randomBytes = require('crypto').randomBytes;
const AWS = require('aws-sdk');
const ddb = new AWS.DynamoDB.DocumentClient();

const fleet = [
    { Name: 'Angel', Color: 'White', Gender: 'Female' },
    { Name: 'Gil', Color: 'White', Gender: 'Male' },
    { Name: 'Rocinante', Color: 'Yellow', Gender: 'Female' }
];
exports.handler = (event, context, callback) => {
    if (!event.requestContext.authorizer) {
        errorResponse('Authorization not configured', context.awsRequestId, callback);
        return;
    }
    const rideId = toUrlString(randomBytes(16));
    console.log('Received event (', rideId, '): ', event);
    const username = event.requestContext.authorizer.claims['cognito:username'];
    const requestBody = JSON.parse(event.body);
    const pickupLocation = requestBody.PickupLocation;
    const unicorn = findUnicorn(pickupLocation);
    recordRide(rideId, username, unicorn).then(() => {
        callback(null, {
            statusCode: 201,
            body: JSON.stringify({
                RideId: rideId,
                Unicorn: unicorn,
                Eta: '30 seconds',
                Rider: username
            }),
            headers: {
                'Access-Control-Allow-Origin': '*'
            }
        });
    }).catch((err) => {
        console.error(err);
        errorResponse(err.message, context.awsRequestId, callback);
    });
};
function findUnicorn(pickupLocation) {
    console.log('Finding unicorn for ', pickupLocation.Latitude, ', ', pickupLocation.Longitude);
    return fleet[Math.floor(Math.random() * fleet.length)];
}
function recordRide(rideId, username, unicorn) {
    return ddb.put({
        TableName: 'Rides',
        Item: {
            RideId: rideId,
            User: username,
            Unicorn: unicorn,
            RequestTime: new Date().toISOString()
        }
    }).promise();
}
function toUrlString(buffer) {
    return buffer.toString('base64')
        .replace(/\+/g, '-')
        .replace(/\//g, '_')
        .replace(/=/g, '');
}
function errorResponse(errorMessage, awsRequestId, callback) {
    callback(null, {
        statusCode: 500,
        body: JSON.stringify({
            Error: errorMessage,
            Reference: awsRequestId
        }),
        headers: {
            'Access-Control-Allow-Origin': '*'
        }
    });
}

Deploy the Function:- Choose Deploy.

4. Validate Implementation

1. Configure Test Event:

• Event Name: TestRequestEvent
• Event JSON:

{
    "path": "/ride",
    "httpMethod": "POST",
    "headers": {
        "Accept": "*/*",
        "Authorization": "eyJraWQiOiJLTzRVMWZs",
        "content-type": "application/json; charset=UTF-8"
    },
    "queryStringParameters": null,
    "pathParameters": null,
    "requestContext": {
        "authorizer": {
            "claims": {
                "cognito:username": "the_username"
            }
        }
    },
    "body": "{\"PickupLocation\":{\"Latitude\":47.6174755835663,\"Longitude\":-122.28837066650185}}"
}

2. Test the Function:

• Select TestRequestEvent and choose Test.

3. Verify Output:

• Confirm the function result matches the expected output:

{
    "statusCode": 201,
    "body": "{\"RideId\":\"SvLnijIAtg6inAFUBRT+Fg==\",\"Unicorn\":{\"Name\":\"Rocinante\",\"Color\":\"Yellow\",\"Gender\":\"Female\"},\"Eta\":\"30 seconds\"}",
    "headers": {
        "Access-Control-Allow-Origin": "*"
    }
}

By following these steps, you will have created and validated a backend process using AWS Lambda and Amazon DynamoDB for handling unicorn ride requests. In the next module, you will integrate this backend with Amazon API Gateway.

Module 4: Deploy a RESTful API

In this module, you will use Amazon API Gateway to expose the Lambda function you built in the previous module as a RESTful API. This API will be secured using the Amazon Cognito user pool you created earlier. You will then turn your static website into a dynamic web application by adding client-side JavaScript that makes AJAX calls to the exposed APIs.

Architecture Overview

You will integrate API Gateway with existing components to enable users to request a unicorn ride through the /ride.html page of your website.

Services Used

• Amazon API Gateway
• AWS Lambda

Implementation Steps

Step 1: Create a New REST API

1. Open the Amazon API Gateway console.
2. Select APIs in the left navigation pane.
3. Choose Build under REST API.
4. In the Choose the protocol section, select REST.
5. In the Create new API section, select New API.
6. In the Settings section, enter WildRydes for the API Name and select Edge optimized in the Endpoint Type dropdown.
7. Choose Create API.

Step 2: Create an Authorizer

1. In the left navigation pane of the WildRydes API, select Authorizers.
2. Choose Create New Authorizer.
3. Enter WildRydes into the Authorizer Name field.
4. Select Cognito as the Type.
5. Under Cognito User Pool, select the same Region you have been using and enter WildRydes in the Cognito User Pool name field.
6. Enter Authorization for the Token Source.
7. Choose Create.
8. To verify the authorizer configuration, select Test.
9. Paste the Authorization Token copied from the ride.html webpage in Module 2 into the Authorization (header) field, and verify that the HTTP status Response code is 200.

Step 3: Create a New Resource and Method

1. In the left navigation pane of your WildRydes API, select Resources.
2. From the Actions dropdown, select Create Resource.
3. Enter ride as the Resource Name, which will automatically create the Resource Path /ride.
4. Select the checkbox for Enable API Gateway CORS.
5. Choose Create Resource.
6. With the newly created /ride resource selected, from the Actions dropdown, select Create Method.
7. Select POST from the new dropdown that appears under OPTIONS, then select the checkmark icon.
8. Select Lambda Function for the Integration type.
9. Select the checkbox for Use Lambda Proxy integration.
10. Select the same Region for Lambda Region.
11. Enter RequestUnicorn for Lambda Function.
12. Choose Save.
13. When prompted to give Amazon API Gateway permission to invoke your function, choose OK.
14. Select the Method Request card.
15. Choose the pencil icon next to Authorization.
16. Select the WildRydes Cognito user pool authorizer from the dropdown list, and select the checkmark icon.

Step 4: Deploy Your API

1. In the Actions dropdown list, select Deploy API.
2. Select [New Stage] in the Deployment stage dropdown list.
3. Enter prod for the Stage Name.
4. Choose Deploy.
5. Copy the Invoke URL. You will use it in the next section.

Step 5: Update Your Website Config

1. On your local machine, navigate to the js folder and open the config.js file in a text editor.
2. Paste the Invoke URL you copied from the Amazon API Gateway console into the invokeUrl value of the config.js file.
3. Save the file.
4. Add, commit, and push the updated config.js file to your Git repository to have it automatically deploy to Amplify Console.

$ git add .
$ git commit -m "new_configuration"
$ git push

Step 6: Validate Your Implementation

<script src="https://js.arcgis.com/4.6/"></script>
<link rel="stylesheet" href="https://js.arcgis.com/4.6/esri/css/main.css">

1. Update the ArcGIS JS version from 4.3 to 4.6 in the ride.html file:
2. Save the modified file.
3. Add, commit, and push it to your Git repository to have it automatically deploy to AWS Amplify console.
4. Visit /ride.html under your website domain.
5. If you are redirected to the ArcGIS sign-in page, sign in with the user credentials you created previously.
6. After the map has loaded, click anywhere on the map to set a pickup location.
7. Choose Request Unicorn. You should see a notification in the right sidebar that a unicorn is on its way and then see a unicorn icon fly to your pickup location.

Example ride.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Ride</title>
    <link rel="stylesheet" href="css/bootstrap.min.css">
    <link rel="stylesheet" href="css/style.css">
</head>
<body>
    <div id="noApiMessage" class="configMessage" style="display: none;">
        <div class="backdrop"></div>
        <div class="panel panel-default">
            <div class="panel-heading">
                <h3 class="panel-title">Successfully Authenticated!</h3>
            </div>
            <div class="panel-body">
                <p>This page is not functional yet because there is no API invoke URL configured in <a href="/js/config.js">/js/config.js</a>. You'll configure this in Module 3.</p>
                <p>In the meantime, if you'd like to test the Amazon Cognito user pool authorizer for your API, use the auth token below:</p>
                <textarea class="authToken"></textarea>
            </div>
        </div>
    </div>

    <div id="noCognitoMessage" class="configMessage" style="display: none;">
        <div class="backdrop"></div>
        <div class="panel panel-default">
            <div class="panel-heading">
                <h3 class="panel-title">No Cognito User Pool Configured</h3>
            </div>
            <div class="panel-body">
                <p>There is no user pool configured in <a href="/js/config.js">/js/config.js</a>. You'll configure this in Module 2 of the workshop.</p>
            </div>
        </div>
    </div>
    <div id="main">
        <div id="map"></div>
    </div>
    <div id="authTokenModal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="authToken">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                    <h4 class="modal-title" id="myModalLabel">Your Auth Token</h4>
                </div>
                <div class="modal-body">
                    <textarea class="authToken"></textarea>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                </div>
            </div>
        </div>
    </div>
    <script src="js/vendor/jquery-3.1.0.js"></script>
    <script src="js/vendor/bootstrap.min.js"></script>
    <script src="js/vendor/aws-cognito-sdk.min.js"></script>
    <script src="js/vendor/amazon-cognito-identity.min.js"></script>
    <script src="https://js.arcgis.com/4.6/"></script>
    <script src="js/config.js"></script>
    <script src="js/cognito-auth.js"></script>
    <script src="js/esri-map.js"></script>
    <script src="js/ride.js"></script>
</body>
</html>

By following these steps, you will deploy a RESTful API that integrates with your website, enabling users to request unicorn rides through a dynamic web application.

Module 5: Resource Cleanup

In this module, you will go through the steps to clean up all the resources you created throughout this tutorial. This will include deleting your AWS Amplify app, Amazon Cognito User Pool, AWS Lambda function, IAM role, DynamoDB table, REST API, and CloudWatch Log. Cleaning up these resources is important to avoid unnecessary charges.

Implementation

Delete your Amplify app

1. Go to AWS Amplify Console: Open the AWS Amplify console and select the wildrydes-site app you created in Module 1.
2. Delete the Amplify App: On the app homepage, choose Actions and select Delete app.

• Enter delete when prompted to confirm, then choose Delete.

Delete Amazon Cognito User Pool (if not using CloudFormation template)

1. Go to Amazon Cognito Console: Open the Amazon Cognito console and select your WildRydes User pool name.
2. Delete User Pool:

• Choose Delete user pool.
• Select the checkbox next to Deactivate deletion protection.
• Enter WildRydes to confirm deletion, and choose Delete.

Delete AWS Lambda Function, IAM Role, and DynamoDB Table

1. Delete AWS Lambda Function: In the AWS Lambda console on the Functions page, select the RequestUnicorn function you created in Module 3. From the Actions drop-down, choose Delete function.

2. Delete IAM Role:

• In the IAM console, select Roles from the left navigation pane.
• Enter WildRydesLambda into the filter box.
• Select the checkbox next to the role you created in Module 3, WildRydesLambda, and choose Delete.
• To confirm deletion, enter WildRydesLambda into the text input field. Choose Delete.

3. Delete Amazon DynamoDB Table:

• In the Amazon DynamoDB console, select Tables in the left navigation pane.
• Select the checkbox next to the Rides table you created in Module 3.
• Choose Delete.
• Select the checkbox next to Delete all CloudWatch alarms for Rides, enter confirm in the text input field, and choose Delete.
• The Status field on the Tables page will change to Deleting, and the table will disappear from the tables list when it has been successfully deleted.

Delete the REST API Created in Module 4

1. Go to Amazon API Gateway Console:- Open the Amazon API Gateway console and select the WildRydes API you created in Module 4.
2. Delete REST API:- In the Actions dropdown, choose Delete.

• Choose Delete on the Delete API confirmation screen.

Delete CloudWatch Log Group

1. Go to Amazon CloudWatch Console: From the Amazon CloudWatch console, expand Logs in the left navigation pane and select Log groups.
2. Delete Log Group: Select the checkbox next to the /aws/lambda/RequestUnicorn log group. If you have several log groups in your account, you can enter /aws/lambda/RequestUnicorn into the Filter text box to locate the log group.

• Select Delete log group(s) from the Actions dropdown.
• Choose Delete when prompted to confirm.

3. Delete CloudFormation Log Groups: — If you launched any CloudFormation templates to complete a module, repeat steps 2–4 for any log groups that begin with /aws/lambda/wildrydes-webapp.

Following these steps will ensure that all resources created during the tutorial are properly deleted, preventing any unwanted charges…

And there you go, if you didn't die till now(physically or mentally) you are done with the project. That all. Hope I didn't give you some trauma or you won't be billed if you followed the documentation properly. At last I would like to conclude this documentation with a famous quote-

I know of no better life purpose than to perish in attempting the greatest and the impossible.” ― Friedrich Nietzsche

THANKYOU!!!