DEV Community

Cover image for AWSCloudChallenge
Leighiam Virrey
Leighiam Virrey

Posted on

AWSCloudChallenge

Image description

Starting off my blog about the Cloud Resume Challenge. This is to detail every step I took to complete the challenge.

HTML and CSS

I started off my journey with taking 2 weeks trying to make my resume. It had been a bit since I renewed it but I got it finished.

I started off writing barebones html and then trying to add it with some CSS.

Image description

Not looking too good as I wanted, I just gave up and faced the reality I am not going to be a great front-end website designer anytime soon. I started browsing for templates and I landed on this template from styleshout.

Image description

I re-arranged everything to fit my aesthetics and to something I can proudly run with.

Website Back-End

With the front-end of the website being done, I started tackling the infrastructure back-end of the website. This is where it started to get fun and challenging.

The Challenge suggested using SAM in AWS to deploy infrastructure, IaC (Infrastructure as Code). I opted out to try and use Terraform, since I have been eyeing it for awhile but I have not really found a project to actually start learning it with.

This is where I found this YouTube channel Will Brock

Totally gave me a great understanding of Terraform and how to utilize and write the code. After about half a day watching his videos I started utilizing the Terraform Documentation to start writing the code myself.

It took me a bit to get everything written out but I got it going. I did have some trouble validating my domain.

Image description

DNS WAS THE WORST. I HAD SO MUCH TROUBLE TRYING TO GET THAT SETUP hahaha. Troubleshooting was a bit difficult since it took 5 minutes to never if it will go up.

Image description

BUT AFTER THAT I GOT IT TO FINALLY WORK THOUGH! Setting up the Route53 (DNS) and CloudFront rewarded my website with the shiny letter "S" to my HTTP.

Image description

I started finishing off the rest of the backend code and doing tests. I managed to finish it up and make it clean and easy to go back to if I need to make changes.

Image description

Github Actions (CI/CD Pipeline) and Coding

When everything seems to have started working perfectly, I started to implement my CI/CD pipeline. This is where I got started with GitHub Actions. Note, Terraform statefiles is needed to keep the configurations of Terraform made infrastructure. This needed to be present to know what Terraform has done before. I configured Terraform to use an S3 bucket as a storage for that statefile so Terraform can access the config files when I move it from local machine to a GitHub Repository.

Image description

I finished off the resume website with adding the visitor count to the front page. The visitor count is suppose to be stored in a database. That is where AWS DynamoDB comes in.

Image description

We needed to interact with the database so we utilized AWS Lambda to update and get the amount of visitors within the database whenever the Lambda function is fired up. Here is the code I wrote with python to do that.

import boto3

table_name = "visitor-count"
dynamodb = boto3.resource("dynamodb")
db_client = boto3.client("dynamodb")
table = dynamodb.Table(table_name)


def increment_visitor():
    response = db_client.update_item(
        TableName=table_name,
        Key = {
            'Primary Key': {
                'N': "0"
            }
        },
        ExpressionAttributeValues = { ":inc": {"N": "1"}},
        UpdateExpression = "ADD visitor :inc"
    )


def retrieve_visitor_count():
    item = table.get_item(
        Key = {
            "Primary Key": 0
        }
    )
    visitcount = (item["Item"])["visitor"]
    return visitcount


def lambda_handler(event, context):
    increment_visitor()
    return retrieve_visitor_count()
Enter fullscreen mode Exit fullscreen mode

Lastly, We needed something to interact with the code in a secure way. That is where AWS API Gateway came in.

Image description

The API is exposed to the web for the written Javascript to interact with in the website.

Image description

Conclusion

Finally! I have been procrastinating trying to do this challenge for awhile. I am so glad and happy I was able to finish it and have a finished product to show off haha.

This challenged pushed me to learn JavaScript, Terraform, and utilize AWS cloud resources. I learned that DNS is still a pain troubleshooting it as a help desk technician as well as building a website. I learned how easy it is to deploy resource with code than utilizing the AWS console (A lot more clicks).

Please check out the website at leighiamvirrey.com the source code is in my GitHub. Here are the links frontend and backend.

Top comments (0)