Hosting a static website in AWS S3 [#1]

A few years ago, I led a small team on a greenfield project where we delivered multiple products: a landing page, a couple of mobile apps, and a web app. I had the chance to choose technologies and cloud providers. Of course, all of these had to be under the project’s budget. The landing site was a marketing page with information about the services provided by the business and a simple subscription form; this was the first deliverable we had to tackle.

At that time, I had some experience using AWS to host .NET projects, and I was about what AWS service I could use to host a static site without needing an EC2 instance. After some research, I found out that AWS S3 (Simple Storage Service) could host static websites.

S3 is a service from Amazon that provides low-cost storage for objects in what Amazon calls buckets, you can create multiple buckets under one account, and each bucket can store multiple objects. Inside these buckets, the folder concept does not exist; you just put your objects inside the buckets and give them names and different access levels. Although folder structure does not exist, this can be simulated using paths in the name of the objects you store. For example, you could name a file: “/mydocuments/budget/hosting-cost.xlsx”, and the folder structure and navigation will be simulated by the AWS S3 navigator and other third-party tools.

Why did I choose AWS S3 for the static website? These are the main reasons why I took the decision:

  • It provides high availability.
  • Low cost.
  • The configuration was straightforward; it saved me a lot of time.
  • There is no server configuration or management needed.

Publishing a static website on AWS S3

Here are the steps to host your static web in S3:

  • Create an AWS account if you do not have one. You can create one at: https://aws.amazon.com/

  • Go to the AWS Services search and open Amazon S3

  • Go to the S3 service and create a bucket; the bucket must have the website’s name you will publish. For example, “abarrenechea.com”

  • Go to the bucket configuration and enable the option to host a static website in the properties tab of the bucket.

  • Upload the files of your static web. You will need a file called index.html file, this is the entry point of your site, and this will be the first page loaded when a user visits it.

  • Don’t forget to grant public read access to these files. Otherwise, it will not be accessible.

Configuring your domain

After your website files are in S3, you will need to make the internet know where to look for your web. For this, I assumed you already have a domain. If so, you will need to make a minor configuration in another AWS service called Route 53; this service provides DNS management.

  • Go to Route 53 service

  • Create a new hosted zone

  • Create a new record in your hosted zone, this record will be of type "A"

  • Under the options you will find an Alias Target option where a list is displayed. The list will include the S3 configuration you have just created, choose this one and save the record.

This was all the configuration needed to make your static website using an S3 bucket, pretty simple right?

Last articles

Most read