AWS Portfolio Website

Summary

I started the Digital Cloud Mastery Bootcamp in September of 2023. This post is a summary of my experience in completing the first capstone project for the certified Solutions Architect portion of the Digital Cloud Mastery Bootcamp. This project deepened my understanding of AWS and highlighted some areas where I need improvement.?

The goal of the project was to create a serverless web site showcasing my abilities with AWS. It includes a certifications page and the following microservices: blog post, view counter, contact form, and latest AWS news feed.

The finished product: https://resilient-compliance-solutions.com/index.html

This required approximately 24 hours for me to complete and that was spread out over about a week. An EC2 AMI with the main website files (html, CSS, JavaScript) and CloudFormation (CF) templates (for microservices) were provided.

Process Overview

An EC2 instance (web server) was deployed from the AMI and the CloudFormation templates were launched to create Lambda functions for the microservices. The html and JS web site components on the web server were updated to reference the Lambda functions, and after verifying functionality, a new AMI was created and an autoscaling group and application load balancer were launched. A CloudFront distribution was created using an existing Route 53 domain name.?The resulting architecture is shown in image 1.

Following verification that the website worked on EC2, the website files were migrated to an S3 bucket configured as a static website and the cloudfront distribution was updated to use the S3 bucket as the origin. The resulting architecture is shown in image 2.

Process - Detailed

Step 1 - Launch EC2 instance from AMI.

The website components were provided in the form of an EC2 AMI (Amazon Machine Image). An AMI is a preconfigured template for an EC2 instance template that, once launched, will include pre-loaded files and settings. In this case it launched a Linux-based EC2 instance where the /var/www/html/ directory included all the html and JavaScript files required to run the website.

Step 2- Launch CloudFormation templates to create Lambda Functions and other resources.

CloudFormation stacks were launched from the provided templates and resulted in the following microservices:

Blog post:

A text file is uploaded to an S3 bucket and a Lambda function is triggered that converts the text to html and stores the html file in a second S3 bucket. A second Lambda function retrieves the html file and displays it on the website.

View counter:

A Lambda function updates a DynamoDB table each time the page is viewed and also retrieves the total views from the table and displays the total view count on the website.

Contact form:

A Lambda function retrieves information from the website contact form (name, email address, message) and uses an SNS topic to forward the contact form message information to a separate email address.?

Latest AWS news feed:

AWS Event Bridge triggers a Lambda function on a daily basis to pull recent AWS news from an AWS RSS feed. The messages are loaded into a DynamoDB table and a second Lambda function displays the news stories from the DynamoDB table on the website.

Terminology

AWS CloudFormation is an infrastructure-as-code service and uses templates to launch stacks of AWS resources.

AWS Lambda is a serverless compute service.

AWS DynamoDB is a serverless, NoSQL database service.

AWS EventBridge is a serverless event bus.

AWS SNS (Simple Notification Service) is a managed messaging service used for loose coupling or microservice applications.

Step 3 - Update the main website EC2 web app files with Lambda function URLs.

Some of the main website files (html and JavaScript) in the /var/www/html/ directory of the? running EC2 instance contained placeholder references for the Lambda functions. These references were updated with the URLs for the microservice Lambda functions to connect everything together.

Step 4 - Testing: verify the web app will open in the browser

To verify that everything worked*, the public IP address of? EC2 instance was pasted into Google Chrome .

*Of course things didn’t work the first time around. Troubleshooting took most of the time spent on the project.

Step 5 - Create a new EC2 AMI and launch an EC2 auto scaling group

A new EC2 AMI was created from the updated web server to be used in the launch template for the auto scaling group. An autoscaling group was launched from the launch template.

An auto scaling group specifies how many EC2 instances to launch and how many should be kept running and how they should be configured. Having multiple instances is an aspect of high availability, where there are multiple resources to handle traffic.

Step 6 - Create Application Load Balancer (ALB)

An Application Load Balance was launched to distribute requests to the running instances in the autoscaling group.

Step 7- Set up a CloudFront distribution

A CloudFront distribution was launched using the ALB as the origin. One of the key capabilities of CloudFront is to cache content in locations that are closer to the end user.

Step 8 - Create DNS records in Route 53 for the CloudFront Distribution

New?A records and AAAA records were created with an alias pointing to my CloudFront distribution. When users open https://resilient-compliance-solutions.com/index.html, Route 53 will route the request to the CloudFront distribution and ultimately to the web page.

Step 9 - Migration to S3

An S3 bucket was created and configured as a static web page. All the files from the /var/www/html/ directory of the EC2 instance were copied to the S3 bucket using the AWS CLI (command line interface).?It was then verified that the website could be opened in Chrome from the S3 bucket by using the S3 endpoint.

Step 10 - Update CloudFront for S3

The CloudFront distribution was updated to point to S3 as the website origin (and removed the ALB as origin).

Challenges/Lessons Learned

As expected, most of the time was spent troubleshooting.I leveraged my other bootcamp peers, the course materials, web search and AWS Q (the generative AI assistant in the AWS console).

• Trouble with the AWS news feed

The AWS news feed uses EventBridge to schedule a Lambda function to fetch messages from https://aws.amazon.com/blogs/aws/feed/ and stores them in a DynamoDB table, a second Lambda displays the contents of the DynamoDB table on the website. The initial fetch worked, but then it seemed like the DynamoDB tale was not getting the latest news since the RSS feed content didn’t match what was in the table. This eventually seemed to resolve by performing a manual execution of the Lambda function by running a test of the function in the AWS console.

• Could not get API gateway to work

The project instructions included setting up an HTTP API using AWS API Gateway for the blog microservice. I could not get this to work. I went with the alternate route of directly using the Lambda function URL.

• I learned that I don't understand security groups as well as I thought I did and there were several occasions where I needed to leverage AWS Q to find out what security group settings were required for one resource to talk to another.
• Setting up CORS can be tricky

CORS (Cross-origin resource sharing) is a security feature allowing client applications to interact with resources in other domains.? CORS configuration was required for several of the services used in this project and they turned out to be tricky. This left me wanting to learn more about HTTP headers (and HTTP in general).

• Limitation of Route 53 certificates

I wanted to create a new Route 53 DNS record to append my name to the domain for better continuity with my LinkedIn profile. I learned that certificates in AWS Certificates Manager don't allow update of existing certificates and that a new certificate must be created.

Future Directions

• Learn more about HTTP Headers. The HTTP protocol underlies much of web technology and AWS leverages HTTP headers quite heavily. My skill will greatly improve if I understand this better.
• Learn how to set up Cloud Watch monitoring for troubleshooting. AWS CloudWatch monitors applications and resources and is a vital tool in understanding architectures that I will design. I will improve my technique with CloudWatch to help me build out and maintain my architecture.
• Build more projects! This is the best way to learn

Special Thanks

Neal Davis, Jill Powers, and Teegan Bartos for ongoing support via the Digital Cloud Mastery program. Nandi Shariff and Jeff Harnois for career coaching support.