Hello and welcome to this lecture which will look at how S3 buckets can be configured to host a static website.

This lecture is not designed to show you how to create a static website using your own domain, instead, it will just focus on the S3 Bucket configurations.

If you are looking to create a simple and static website that requires no server-side scripting of any kind, then this can easily be hosted with one of your Amazon S3 buckets.

Let me explain the bucket configuration required to enable this. So from the Properties page of your chosen S3 bucket, select the Static Website Hosting tile. By default, static website hosting is disabled. When this tile is selected you are presented with three options, Use this bucket to host a website, Redirect requests, and Disabled.

In addition to these options, there is also a region-specific website endpoint shown for your bucket. This endpoint allows users to access your website via that URL. However, there a couple of points to understand when using your S3 endpoint as your website URL address. Firstly, it does not support HTTPS requests. The bucket and its contents must be marked as publicly accessible. And it does not support Requester Pays. And I'll be discussing more on Requester Pays later in this course.

If you select the option of Use this bucket to host a website you need to provide additional parameters in its configuration.

Firstly, you need to add an index document. And your index document will be the default, or home page of your static website. The error document will be the page that is displayed when an error occurs. And these documents must be located within your bucket. The redirection rules allow you to use XML to create advanced redirect requests to specific content. For advanced information on how to create these redirection rules please see the following link.

Once you have added your index and error document and optional redirection rules, select Save.

The other option available to you is Redirect Requests. And this option allows you to redirect all traffic to your website endpoint. In this example, any traffic destined for the following endpoint will be redirected to www.mywebsite.co.uk. The target destination could also be another bucket configured for static website hosting. The Protocol field allows you to enter which protocol should be used during the redirect.

For people to be able to access your website hosted within your S3 bucket, then the bucket must be accessible to the public, so we need to ensure that the permissions are set correctly. By default your S3 buckets are blocked to the public. If you select your bucket and then permissions tab, you will see the current settings for your bucket under the Block all public access.

Here you can see that by default all access is blocked to the public. You must edit these settings and uncheck the Block all public access setting, save and confirm those changes.

Once your bucket is publicly readable, you will then need to add a bucket policy to allow the public to read your objects within your bucket. So to do so, you need to select the Bucket Policy tab from within the permissions of your Bucket and enter following policy, replacing the text in red with the name of your bucket being used for your static website.

This policy allows everyone to have the action of s3:GetObject from your bucket hosting your website And you will be notified via a warning that this will make all objects publicly accessible, accept the warning as this is the outcome that you are trying to configure.

So at this stage, you would have added your index.html document, configured your bucket to be publicly accessible, and also added a bucket policy to allow the objects within your bucket to be accessed and read by the public. All that is left to do now is to test it using your website endpoint. It is also possible to set up your static website with your own customized domain name instead of the automatically generated website endpoint created by S3.

In addition to serving your content via CloudFront, however, these configurations and topics are out of scope for this course. I now want to show you a very quick demonstration of the points I just walked through so you can see it via the console, so let's take a look.

Okay, so I'm at the AWS Management Console or the front screen. So firstly, I need to go to Amazon S3, which is under Storage. And this will take me to my S3 dashboard with all of my buckets that I have. Now I've already created a bucket and it's called stustaticwebsite. So if we have a look at this bucket, we can see that there's no objects in here. And if we look at the properties, we can see that static website hosting is currently disabled. And if we go across to the Permissions, we can see that all public access is currently blocked and there is no bucket policy.

So let me start by unblocking the public access. So if I go across to the Block public access tab, select Edit, and then uncheck the Block all public access and then Save. And here just needs typing confirm to confirm that I want to make those changes. And now I can see here that public access settings has been updated successfully. And the Block all public access now shows as off. From here, now I want to add my index file. So I've already created a file called Myindex.html so I just gotta cross and find that. There we have it there, Myindex.html, select Open. Click on Next.

Now under the Manage public permissions, I want to grant read access to this object. 'Cause I want people to be able to see my index file to my website. Click on Next. Select your storage class, I'll just select Standard for this demonstration. And then click Upload. So that's Myindex.html file. Now if I go across to Properties, and enable static website hosting. So if I select on the tile, and use this bucket to host a website. Enter the name of my index file. And here you can add the error document as well if you want and any redirection rules. For this demonstration, I'm just gonna leave it as Myindex.html. And up here we can see the endpoint that will be used to access our website as well. Let's click on Save

So now we've enabled static website hosting, we've added our index file to the bucket, we've changed the permissions to ensure that public access is allowed, however, we still need to add our bucket policy. So if I paste my policy in that I've already created. And we can see here that this allows any principal, the s3:GetObject for this bucket here. Click on Save. And you'll be issued a warning to say that you have provided public access to this bucket. We highly recommend that you never grant any kind of public access to your S3 bucket. This is intended, so you can just ignore that warning.

Okay, so now we've unblocked all public access, we've entered a bucket policy that allows anyone to access this bucket using the s3:GetObject action, we've added our HTML file to the bucket, and we've also enabled static website hosting. So all we need to do now to test it is to select the endpoint. And there we go. And this is the Myindex.html file that I added to the bucket. So if we just go back to the bucket so you can have a look at that. If I open that file, you can see that it's the same file. And that's how you quickly and simply configure static website hosting.