Implementation of a Scalable Web Application using the services of AWS Elastic Beanstalk, DynamoDB, CloudFront and Edge Location

Anurag Chawla
6 min readMay 23, 2023

--

Here implementing an application that needs to support the high demand of a large number of users accessing it simultaneously.

Consider use-case in which application has been used in a large conference/event that had more than 10,000 people, in-person and online, with participants from all over the world.

This conference/event was broadcast online and in person and 10 vouchers were drawn for 3 Cloud certifications. At that moment, more than 10,000 people in the audience registered their e-mails to guarantee their participation in the raffle.

Cloud Project — AWS Provider with Services and Technologies

We used in AWS, Elastic Beanstalk services to deploy the web application, DynamoDB to store emails, CloudFront to cache static and dynamic files in an Edge Location close to the user.

Solution Architecture:

Solution Architecture — Scalable Application for the Conference/Event

In architecture -the participants can access the web application sitting in Auditorium, using online You-tube channel/Instagram or accessing it using Mobile, Desktop and put it an email address to get a cloud certification voucher,

The architecture comprises of the following components:

  • The Amazon DynamoDB that can store the user emails from the Audiences . The DynamoDB here is reason for this is high performance and highly scalable NoSQL database service that is created for that kind of load coming from the web.
  • EC2 instance inside the Auto-Scaling Group — to deploy the application to EC2 instances in a way that if Auto-Scaling Group needs EC2 instance based on the CPU utilization such as if it goes beyond 50% increase one— or if it goes below 40% of CPU utilization remove one EC2 instance
  • Elastic Load Balancer- bascially route the traffic to different instances at the same time to spread the load.
  • Elastic BeanStalk- This above all is manage and created by Elastic BeanStalk which is powerful and simple to deploy this architecture.
  • CloudWatch- along with Elastic BeanStalk to keep monitoring the environment while its been created and used.
  • CloudFront — cloudfront distribution connect to the application — inorder to speedup/performance of the application the user access who are geographically separated — this will cache the static as well as dynamic files closer to the user at their Edge Location to access the application very quickly.
  • Amazon Route 53 created by CloudFront— this is the entry point route having url for the application for the users so that they can access the application.

First, DynamoDB — DynamoDB is a fully managed NoSQL DB service that provides high performance and scalable.

Here Created Table name: Users having Partition key : email

DynamoDB: Table name — users and Partition key- email

Then, followed by Elastic BeanStalk — Elastic Bean service will deploy and manage the web application in AWS Cloud without worrying about the infrastructure that runs it. We will upload the application files from S3 bucket and it will automatically handle the details of capacity provisioning, load balancing, auto-scaling, and application health monitoring etc.

Step-1 Configure environment- Select the Environment tier — Web / Worker and provide Application name, Environment information, platform as well as steps to deploy the web application using S3 bucket.

Elastic Beanstalk :Environment tier — Web / Worker and provide Application name, Environment information
Elastic Beanstalk: Provide Platform as well as steps to deploy the web application using S3 bucket.
Elastic Beanstalk: Set the Preset as High avaliability.

Followed by step- configuring instance traffic and scalling

Elastic Beanstalk: Instances — Root volume
Elastic Beanstalk: Capacity— LoadBalancer instances-min,max, Auto-Scalling Group
Elastic Beanstalk: Capacity —Instance Type for prototying slected t2.micro
Elastic Beanstalk: Scaling triggers — Metric — CPU utilization etc

Followed by step -Set up networkimg, datbase and tags

Elastic Beanstalk: Select the default Virtual Private Cloud
Elastic Beanstalk: Instance settings of t2.micro selected from the above step for subnets for AZs
Elastic Beanstalk: AZs for the Load Balance subnets
Elastic Beanstalk- Set Env Properties AWS_REGION as us-east-1
Elastic Beanstalk- Review it and Submit
Elastic Beanstalk- lauching your environment
Instances Created by Elastic Beanstalk- Running succesfully
Elastic BeanStalk: Environment successfully launched

When clicked on above Domain —it will open the site address in browser : it display Internal Server Error: As DynamoDB has not given the permission to talk to application deployed by Elastic Beanstalk

Error : DynamoDB has not given the permission to talk to application deployed by Elastic Beanstalk

In-order to resolve this permission assign permission for AmazonDynamoDBFullAccess

Application Launched when accessing the domain

Enter email address and click on Register:

It will display status -“Thanks Email registered successfully!!!”

Status provided by the application After Registration

The registered user can be found in — DynamoDB under Table name: users

DynamoDB: Table Name:users , email inserted

Then follow by CloudFront -Elastic Beanstalk fronted by CloudFront which is also know as CDN — that speeds up distribution of static and dynamic web content, such as .html, .css, .js, and image files users.

When a user requests content, the request is routed to the edge location that provides the lowest latency and high performance as it get closer to the user edge locations.

CloudFront: Select the Elastic Load Balancer which

The Elastic Load Balancer: bascially route the traffic to different instances at the same time to spread the load.

CloudFront: Select the HTTP method and cache optimization
CloudFront: After setting the configuration and click — Create distribution
CloudFornt: Successfully created new distribution

Copy the Distribution domain name to browser- as below. it will open the application which is fronted by CloudFront

CloudFront: Domain name — launch application

Enter email address and submit -it will display the the status- “Thanks!! Email registered successfully!!!”

Application- Shows status

In DynamoDB- able to see the added users using the application fronted by CloudFront

In DynamoDB- Emails added in users table from the web-application fronted by CloudFront

Further one can do the stress test to performing load/performance test by login remote to one of EC2 instance of ElasticBeanStalk- where when the CPU utilization goes beyond the 50% — it will increase the EC2 instance by one and later when stress load is removed, it will decrease the EC2 instance accordingly based on the AutoScaling configuration of ElasticBeanstalk.

--

--

Anurag Chawla

Emerging Technologies - Power Virtual Agents | AI Chatbots | Multi-Cloud & DevOps | UI Technologies - React , Angular | Gaming Technolgies - Unity, XR- AR/VR