Unleashing the Power of the Cloud (AWS): The Epic Journey of the Cloud Resume Challenge - Part 1: S3 static website hosting.

Steve Murimi
5 min readJul 14, 2023

--

AWS Cloud resume challenge.

To start the challenge, it is generally a good idea to quickly draw the architecture you envision. Below is what I want to implement:

To get off to the quickest start for both professional web developers and newbies, it is advisable to get a website template from a reputable website, some of the free resources that I considered include:

  1. html5up.net
  2. themewagon.com
  3. bootstrapmade.com
  4. plainenglish.io and
  5. W3 schools to quickly learn the basics of a website templates’ files ie HTML, CSS and JS.

Once you download a template and edit it to suit your preferences, we can then create an S3 bucket.

Visit my resume website to get some inspiration: Steve-Cloud-resume-challenge

With your chosen template in hand, it’s time to carve your digital masterpiece. But first, let’s create an S3 bucket — a haven that will shelter your web wonders. Prepare to be amazed as I guide you through the process step by step.

Create the S3 bucket

First navigate to S3 on your AWS console and setup your bucket as below, please make sure to use a bucket name that is globally unique.

Public Access?

Safety is of utmost importance, so we shall block all public access and disable Access Control Lists, safeguarding your creations from prying eyes.

NB: For purposes of this series we will use Cloudfront to control access to the website but if you dont want to use Cloudfront, then it is advisable to enable public access at this point and configure the security options as necessary.

Versioning?

If you’re a meticulous creator who enjoys retracing your steps, consider enabling bucket versioning. This invaluable feature allows you to restore your bucket to a previous state whenever the winds of change blow in. However, bear in mind that this extraordinary power does come at a cost.

For now, we shall disable bucket versioning, but always keep it in your arsenal of skills. We will also add a tag so that we can easily trace the resources created.

But wait, we haven’t finished fortifying your digital fortress! Let’s fortify it further with encryption. Enable bucket encryption, and watch as your creations become impenetrable to the forces of chaos. Fear not, this added layer of security comes at no additional cost, providing peace of mind as you forge ahead.

Encryption?

The write once read many setting (WORM) model also enables a higher degree of safety against mistakenly destroying or changing resources in your bucket but for this instance it is not necessary.

We are all set, counter check your settings, take the leap and create your bucket.

Once the bucket is created, go to Properties and enable static website hosting. Also set your website top level web page / home page as the index document, this is typically the index.html file.

Static website hosting.

Upload your website files.

Once done, go to the Objects tab and upload your modified website files.

Confirm successful upload.

To enable bucket access by our website endpoint we will need to create a Bucket policy to allow “GetObject” actions. Below is a sample policy you could use:

{
“Version”: “2012–10–17”,
“Statement”: [
{
“Effect”: “Allow”,
“Principal”: “*”,
“Action”: “s3:GetObject”,
“Resource”: “arn:aws:s3:::YOUR-BUCKET-NAME/*”
}
]
}

Once you are done, you can test out the reachability of your website by visiting the public S3 website endpoint under the properties tab.

As your website emerges unscathed from the trials of deployment, revel in the achievement of a successful launch. Bask in the glow of your newfound power — the ability to deploy your website to an S3 bucket.

Test your deployment.

This is a good chance to make sure that your website appears as intended and that all your resources are properly linked. This is especially important because while editing the website locally, some of the locally linked resources worked but once you upload them to the bucket, the resource may be a level lower or higher depending on how the upload was done.

NB: If your website is not accessible the first thing I would check is the bucket policy.

Celebrate!

Once your website is correctly displayed, you can pat yourself on the back for successfully deploying your website to an S3 bucket.

Join me next time as I embark on Part 2: Conquering Cloudfront — Harnessing the Forces of Global Content Delivery. The Cloud Resume Challenge continues.

This is an image of a person celebrating for having implemented the article and getting everything to work.
Photo by Ambreen Hasan on Unsplash

--

--