Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.
Learn Hosting an HTML Page on S3 | AWS S3 Overview
Introduction to Cloud Computing
course content

Course Content

Introduction to Cloud Computing

Introduction to Cloud Computing

1. Introduction to Cloud Technologies
2. AWS S3 Overview
3. EC2 Overview
4. RDS Management

book
Hosting an HTML Page on S3

Since we've hosted various elements like scripts and styles in our public S3 bucket, you might have considered hosting a full HTML page or a static website on the S3 bucket. In this chapter, you'll learn how to do this on a public S3 bucket, accessible via a link. Let's dive in!

Hosting an HTML Page on AWS S3

To begin, I recommend creating a separate folder in the bucket where we'll store all the resources related to this web page for easier management and development:

Now, as usual, we need to upload the HTML file to our public bucket.

The HTML file we'll be uploading looks like this:

html

index.html

copy

Now let's upload it to the S3 bucket:

Now, all we need to do is follow the link to this bucket, and we'll have our HTML page, which serves as our portfolio, right in front of us.

The most interesting part is that this page is in the cloud, and we will always have access to it.

Static Web Page

There is another way to host a web page on S3, and this method will be more specialized for web pages. Let’s take a look at how to do it.

First, we need to create a new bucket and upload the HTML file that will be the main page of our static website.

To do this, let's create a new bucket and upload the HTML file with the portfolio:

Next, we go to the "Properties tab" and scroll down to the bottom of the page. We’re looking for the section called "Static website hosting", as shown in the screenshot below:

We open this section and select "Enable" in the "Static website hosting" row.

Next, we need to specify the index document, which, in our case, is portfolio.html. If you have an error handling page, you can specify that as well. Then, just save the page.

Next, we need to save the changes, and Amazon will provide us with a link to our static website, which you can find at the bottom:

Now, when you visit this link, you'll be able to see our HTML page hosted on AWS S3:

Keep in mind that this isn't the best way to host a website; there are specialized services for that, like Amazon EC2.

On S3, we can host small static websites, but it might not be enough for larger applications.

Hosting on S3 is quite straightforward, and now you know how to upload and store your media there.

Everything was clear?

How can we improve it?

Thanks for your feedback!

Section 2. Chapter 6
We're sorry to hear that something went wrong. What happened?
some-alt