DEV Community

Nandan K
Nandan K

Posted on

DevOps Project: Hosting Serverless Web Application in AWS using S3,Lambda, CloudFront, DynamoDB, Route53, SSL certificate

#docker #aws #terraform #kubernetes

🎯 DevOps is not just about learning tools; it’s about applying them to solve real-world problems. One of the best ways to build practical DevOps skills is by creating hands-on projects that demonstrate how different cloud services work together.

In this project, I built a serverless web application using core AWS services such as AWS Lambda, Amazon DynamoDB, CloudFront Distribution, Amazon S3, Route53, SSL certification and also integrating these different AWS services.

📌 AWS Services used to implement the project:

  1. The application follows a serverless architecture, which means there are no servers to manage, and AWS automatically handles scaling and infrastructure management.

  2. Amazon S3 will host the static website

  3. AWS Lambda will run the backend logic that processes user requests.

  4. DynamoDB as database

  5. Route53 for DNS name resolution

  6. created CloudFront distribution to speed up the data delivery

  7. Created SSL certificate using Amazon certificate manager and attach it to CloudFront (for HTTPS secure connection)

Github Repo for source code: https://github.com/Nandan3/Projects_on_AWS_Lambda

📌 About AWS Lambda:

✅ What AWS Lambda does:

  1. A serverless compute service that lets you run code without provisioning or managing servers.
  2. Runs code without servers - You don’t manage EC2 instances.
  3. Automatically scales depending on the amount of user traffic.
  4. Integrates with other AWS services - S3, DynamoDB, CloudWatch, SNS, SQS, API Gateway, etc.
  5. Supports popular programming languages like Python, Java, C#, Node.js, Go, Ruby, Power shell.
  6. It has runtime API extension that allows you to use other programming language not listed.

✅ How It Works (Flow):

  1. Lambda starts with an events, which triggers lambda to do something or execute the code.
  2. Source of the event is another AWS services like S3, API Gateway. It can be trigger from stream of data or queue, like Kinesis Data Streams or Simple Queue Service.

📌 About Dynamo DB:
✅ Intro:

  1. Managing and scaling NoSQL DB for web application and services.
  2. Replicates data across multiple AWS Regions automatically.

✅ Features:

  1. NoSQL data: Key-value and document-style storage.
  2. Provides us fully managed serverless and highly available DB
  3. Handle high traffic applications
  4. Works with Lambda, API Gateway, Step Functions, etc.
  5. Secure - Encryption, IAM-based access control, and VPC integration.

✅ Dynamo DB - Components:

  1. Tables: place to store data or collection of data
  2. Items: each table contains zero or more items. Entry into the table.
  3. Attributes: items composed of one or more attributes. Like properties within table.

✅ Use cases:

  1. Building internet scale applications, which supports user content, metadata and caches that require high concurrency and connections for millions of users and millions requests per seconds.
  2. Also great for workloads that are used within real time video streaming and interactive content because it delivers low latency with multi-region replication.

Project Architecture:

🎯 Detailed guide for implementing the project:

📌 Steps to Configure S3:

✅ Step 1:

  1. Go to S3 in AWS Console
  2. Create S3 bucket with proper configuration set up. Name: Serverless-web-application Type: Private S3 bucket Server-side encryption with Amazon S3 managed keys (SSE-S3)

✅ Step 2:

  1. Upload HTML, Java script, CSS files into S3 bucket

📌 Steps to configure CloudFront Distribution:

  1. CloudFront is secure content delivery service in AWS and reduce the latency, ensures high data transfer speed.

✅ Step 1:

  1. Go to CloudFront >> create Distributions Origin type: Amazon S3 S3 Origin: serverless-web-application-using-lambda.s3.ap-south-1.amazonaws.com (select from dropdown)

✅ Step 2:
Copy S3 bucket policy, which you need to attach to bucket. So that CloudFront can access the S3.
Go to CloudFront >> click on the distribution, which you created now >> select "Origin" >> select "origin name (severless-web-application)" >> Edit.

✅ Step 3:
Copy the CloudFront Policy

✅ Step 4:
Go to S3 bucket >> Permissions >> bucket policy >> paste the policy, which you copied

This allows the CloudFront Service principle to access S3 bucket

✅ Step 5:
Make sure that the default root object is "index.html" in cloud front. Because in S3 - "index.html" is the entry point to our application.

📌 Enable Route53 for CloudFront Distribution
✅ Step 1:

  1. Purchase your own DNS name from GoDaddy or Route53 itself.
  2. Then create Hosted zone by using DNS name in Route53 (if the DNS name is purchased from external).

✅ Step 2:

  1. Inside CloudFront distribution >> origin >> add DNS name and select custom SSL certificate (if don't have request the certificate in Amazon ACM).

Add DNS record and SSL certificate into CloudFront

  1. To request SSL certificate >> go to Amazon ACM >> request a certificate with "*.nandanwithtech.in" domain name.

  1. Validate the certificate with Route53 for that: click on the certificate >> under "Domain" section >> create records in Route53 >> proceed.

A CNAME record will be created under Route53

✅ Step 3:

  1. Create Route53 record for "serverless" subdomain in serverless.nandanwithtech.in

Now try to access the application with registered DNS name with "secure https": https://serverless.nandanwithtech.in/

📌 Steps to Create DynamoDB tables and map it with Lambda functions

  1. Create a Dynamo DB table and make sure to create an IAM role for the Lambda function to give permission to access DynamoDB table.

✅ Step 1:

  1. As we see in the web application, whenever any person enter his/her name and submit the details and refresh the page, view count should be increased.
  2. For this, I'm creating Dynamo DB table in AWS and adding the Id, view items into the table.

✅ Step 2:

  1. Create an IAM role and give permissions to Lambda functions to access dynamoDB. Go to IAM >> Role >> create role
  2. Here I ensured the "least priviliged access" control mechanism, by giving only required permissions through policy and attached it to role.

📌 Creating a Lambda function and integrating with the website

✅ Step 1:

  1. Go to Lambda >> create Lambda function Name: serverless-web-app-lambda Language: Python 3.14 Enable function URL to assign HTTPS to Lambda function

proceed with the Lambda function

Function URL: https://atzqihljt3dupct4orlsbjm5yi0qwgrl.lambda-url.ap-south-1.on.aws/

  1. Add IAM role to Lambda function to access Dynamo DB Go to Lambda function >> configuration >> Permissions >> click on Edit >> choose execution role.

  1. Update the code into Lambda function >> Test the code

  1. Access the website using secure domain name - https://serverless.nandanwithtech.in/

📌 Error during implementation:

Solution: Add PutItem permission in IAM policy

Top comments (0)