My AWS Cloud Resume Challenge Journey (Part One)

Written by okeybukks | Published 2023/03/04
Tech Story Tags: aws | cloud | cloud-resume-challenge | cloud-computing | amazon-web-services | web-development | webdev | cloud-security

TLDRI intend to take my readers on a journey of skills learned, challenges faced, and solutions uncovered along the way as I take on the cloud resume AWS challenge.via the TL;DR App

I have been scouring the internet, looking for pointers on how to build my cloud resume and make it stand out as it has been a long dream of mine to go into the cloud engineering space.

Then, I stumbled on the Cloud Resume Challenge. On digging a little deeper, I discovered that the resume challenge would expose me to a plethora of real-world problem scenarios that I could face working in the cloud. And getting through it would imbue me with confidence to tackle these challenges if/when they come.

I intend to take my readers on a journey of skills learned, challenges faced, and solutions uncovered along the way. The end goal of this series is to get a cloud role, so I will be appealing to my readers to keep me up to speed with opportunities in this space.

In the first part of this series, I’ll be setting up an HTML and CSS website for my resume, deploying to an AWS s3 bucket, deploying it on AWS Cloudfront, linking the Cloudfront to a custom domain using AWS Route53, and finally ensuring this domain name is secured.

Not being too artistically inclined, I decided to surf the internet to get HTML templates I can edit and personalize. I have a reasonable understanding of how HTML and CSS work. I found a beautifully made react portfolio app created by Sachin Mittal. I was able to edit the files to suit what I want. The Github repo of the edited file can be found here.

With the resume ready and working on my local system, my next goal was figuring out how to push my react app files to my AWS s3. To push your files to your S3, you must ensure you’ve got an s3 bucket ready. You can check out this video for a guide.

Since we are working with react, we have to first build the app, then push the build folder created by react to our s3 bucket. To create the build folder I ran the following commands in the folder where I have my react files.

# First install react dependencies for the react app
npm install

# Build the react resume project
npm run build

I moved my files to my s3 using AWS CLI, you can check out this article to set it up.

This is the command I used to move the folder.

# s3://achebe-cloud-resume/ is my AWS s3 bucket
aws s3 sync build s3://achebe-cloud-resume/

Once done, I ensured I set up the necessary policies to guide my objects in the s3 bucket.

With my s3 bucket set, I used the created endpoint of my s3 bucket website as the origin of my Cloudfront. I created a public certificate with AWS Certificate manager and added it as a CNAME to my created Route53 hosted zones. For my domain name, I created one using freehostia.

You can check out the created resume using this link.

I faced a couple of challenges though which I had to find out how to resolve. The first challenge I faced was getting this error while creating my s3 policy.

Action does not apply to any resources in statement

Now, this was the policy I was using;

{
    "Version": "2012-10-17",
    "Id": "Policy1677839372704",
    "Statement": [
        {
            "Sid": "Stmt1674835361089",
            "Effect": "Allow",
            "Principal": "*",
            "Action": "s3:GetObject",
            "Resource": "arn:aws:s3:::achebe-cloud-resume/"
        }
    ]
}

The error was in this line;

"Resource": "arn:aws:s3:::achebe-cloud-resume/"

The correct form was;

"Resource": "arn:aws:s3:::achebe-cloud-resume/*"

The ‘*’ captures all objects in the bucket.

The second challenge I faced was, creating an Alias record in my Route5e for the Cloudfront, the record could get my created Cloudfront resource. Then I began to dig to find out why, then I found out that for the record to find my Cloudfront resource, my domain name has to be added as an Alternate domain name (CNAME) in the Cloudfront resource settings.

For the next article, I will be building a working AWS serverless API that updates the visitor count in a database.


lead image source.


Written by okeybukks | An Igbo man with a conscience. Cloud engineering student at AltSchool Africa.
Published by HackerNoon on 2023/03/04