
Table of contents
- Introduction
- Host a website in Amazon S3
- Associate a custom domain with Amazon Route 53
- Host a personal portfolio online
- Conclusion
- References
Introduction
Have you ever wanted to build your own website? Maybe to showcase your work, your business, or just a way to have an online presence?
For most applications, websites can run with only client side code and be comprised of only HTML, CSS and JavaScript. Such websites are usually defined as static websites. With no server side code to run or maintain there is no point in using conventional web servers.
Amazon Web Services (AWS) offers multiple options for hosting static or dynamic websites. For static content, the simplest and most affordable option is the Amazon Simple Storage Service (S3).
In this post, we’ll cover how to create an S3 bucket and set it for web hosting, point the S3 endpoint to a custom domain and create a simple portfolio website.
Host a website in Amazon S3
‘Amazon Simple Storage Service (Amazon S3) is storage for the Internet. It is designed to make web-scale computing easier. Amazon S3 has a simple web services interface that you can use to store and retrieve any amount of data, at any time, from anywhere on the web._’_¹
The above statement from Amazon summarises the purpose of S3: Providing a simple interface to store and retrieve data in a highly scalable and reliable way. Not only this, but storing data in Amazon S3 is a viable and affordable solution.
These key advantages together with not needing a web server make Amazon S3 an ideal service for static web hosting. Let’s dive into Amazon S3 and host our first website.
Create and configure S3 for web hosting
The first step is to create an S3 bucket to store our website files. To do this, navigate to the S3 interface and click ‘Create bucket’.

In the ‘General configuration’ section define the ‘bucket name’ as ‘portfolio.#DOMAIN_NAME#’. This will be the homepage link to your portfolio. Replace #DOMAIN_NAME# with the name of a domain you own. If you do not own a domain and/or do not want to create one (check the next section on how to register a domain) this can be any sequence of allowed characters in rfc3986².
In the next section, uncheck the ‘block all public access’. This will allow users to retrieve the static pages stored in the S3 bucket.
Check the warning box ‘Turning off block all public access might result in this bucket and the objects within becoming public’ and click ‘Create bucket’.

Click on the bucket name you just created and go to ‘Properties’. Scroll down and click on the ‘edit’ button in the ‘static web hosting’ section.
In this window:
- Select ‘Enable’ in the ‘Static website hosting’
- Keep the default ‘host a static website’ in the ‘Hosting type’ section
- Type ‘index.html’ in the ‘Index document’
- Click save changes

Move to the ‘Permissions’ section, scroll down and click on the ‘edit’ button in the ‘bucket policy’ section. In the text box, type the following policy³ and click ‘save changes’.
{
"Version": "2008-10-17",
"Statement": [
{
"Sid": "AllowPublicRead",
"Effect": "Allow",
"Principal": {
"AWS": "*"
},
"Action": "s3:GetObject",
"Resource": "arn:aws:s3:::portfolio.#DOMAIN_NAME#/*"
}
]
}
Your bucket policy should look like this.

Upload data and test the website endpoint
Still in the S3 bucket you created, move to the ‘Object’ section and upload a new file named as ‘index.html’ with the following content:
<html>
Hello World!
</html>
You can create this file with any text editor. Just make sure you name it as ‘index.html’. Your S3 bucket should now look like this.

We can test if the website is working by opening the following link: http://portfolio.#DOMAIN#.s3-website-eu-west-1.amazonaws.com

Alright! We just created a working website. What we are missing is a link between this endpoint and a custom domain.
If you have a domain you own, or want to create one now using Route 53, move to the next section to link our newly created endpoint to the domain. Otherwise, move to the ‘Host a personal portfolio online’ section to create your first portfolio website.
Associate a custom domain with Amazon Route 53
Amazon Route 53 is a highly available and scalable cloud Domain Name System (DNS) web service⁴. Amazon Route 53 can be used to route a custom domain to any AWS service (like an S3 endpoint). This service is recommended as it integrates easily with many AWS services such as S3, CloudFront, or EC2.

Although you can register a domain through multiple providers, Amazon Route 53 also provides a simple way to register a custom domain. Using Route 53 simplifies the whole process from registering a domain to hosting a website.
Registering a custom domain with Route 53
To register a domain navigate to the Route 53 homepage, then click on ‘Get started’. Click ‘Register a domain’, type the domain you would like to register and if available add it to cart. Finally, add the detail as shown below and complete the registration process.

When you register a domain with Route 53, AWS automatically creates a ‘hosted zone’ for the domain and charges a small monthly fee for the hosted zone in addition to the annual charge for the domain registration.
If you decide to not use Route 53 you can delete the hosted zone within 12 hours of registering the domain and you will not be charged for it. In this tutorial we will assume that you will use Route 53 to handle the routing between endpoints and your domain.

Associate a custom domain to an S3 endpoint
To link the previously created S3 endpoint, click on ‘hosted zone’ in the Route 53 homepage, then click on your domain and finally ‘Create record’.
In this new window type ‘portfolio’ in the ‘Record name’ and match the remain fields as below. Make sure the S3 bucket that is automatically identified matches the one we just created. Finally, click ‘Create records’.

Let’s now test our custom domain ‘portfolio.#DOMAIN#’

Nice. We managed to create a fully functional website hosted on S3 and linked to our custom domain. Now you just need to add your content to S3 and it will become readily available in your website.
Host a personal portfolio online
For the sake of completion, let’s download a bootstrap portfolio template and add it to our website.
To do this, go to https://startbootstrap.com/theme and download their free freelancer template (or any other you prefer).

Extract the content of the zip file locally, and drag and drop the files to the S3 bucket you created.

Finally refresh your website, and your new portfolio should appear.

Conclusion
Hosting a static website has never been so easy.
Amazon S3 provides a simple interface to store and retrieve large amounts of data in a flexible, scalable, fast and inexpensive way.
At the same time, Route 53 simplifies the creation and routing of custom domains and is incredibly easy to integrate with S3 and other AWS services.
As if this was not enough AWS provides a free tier for new users using S3 for the first 12 months⁵. So if your website is below 5GB you only pay for the domain registration and hosted zone.
References
[1] Amazon Team. "What is Amazon S3?" https://docs.aws.amazon.com/AmazonS3/latest/userguide/Welcome.html
[2] T. Berners-Lee et al. "Uniform Resource Identifier (URI): Generic Syntax" (2005) https://www.ietf.org/rfc/rfc3986.txt
[3] Amazon Team. "Setting permissions for website access" https://docs.aws.amazon.com/AmazonS3/latest/userguide/WebsiteAccessPermissionsReqd.html
[4] Amazon Team. "Amazon Route 53" https://aws.amazon.com/route53/
[5] Amazon Team. "AWS Free Tier" https://aws.amazon.com/free/?all-free-tier