Hello All! Welcome back to the third article in the AWS Series! As we already know, AWS S3 offers low cost, high performance, highly scalable, unlimited cloud storage with a pay-as-you-go approach. But, apart from being a storage option, it can also be used to host static web content. In this article, we will discuss how to host a static website in AWS S3.
Below is the overview of the steps for doing that:
- Creating a bucket
- Enabling static website hosting
- Setting permissions using bucket policy
- Testing the static website
- Conclusion
Creating a bucket
Step1: First let’s create a bucket. For that, let’s first login to AWS console, and then select ‘S3’ under ‘Storage’ from the AWS ‘Console Home’.
select S3
Step2: Next, from the S3 console, let’s click on the ‘Create Bucket’ icon in the Amazon S3 console.
Creating New Bucket
A pop up window appears wherein we enter the bucket details. Here, let’s consider the bucket name as ‘codebabel-static-website-demo’ and the region can be according to the requirement. Here we have chosen the default region ‘US EAST ohio’. Let’s leave everything to default settings by clicking on “Next” option. In the ‘review’ page, let’s review our configurations and click on ‘Create bucket’ to create the S3 bucket.
Create New S3 Bucket
We can see the newly created S3 bucket in the AWS S3 console.
Created Bucket can be viewed in S3 Dashboard
Step3: For this demo, we have created a simple static website in HTML. It consists of an **index.html **file which has two web pages and an **error.html**file which throws an error message when something goes wrong. We also have some .css files for formatting. Now let’s upload these files in the AWS S3 demo bucket.
For this, let’s click on our S3 bucket and click on the “upload” option under the “overview” icon. We can either add or drag and drop the required files. We can also set permissions for each of the files while uploading by clicking the “Next” icon which we will discuss later in this article. For now, we will only upload the files by clicking “Upload“. Let’s upload all our files this way.
Upload Files
Enabling static website hosting
Step4: Let’s click on our S3 bucket, and go to Properties -> Static website hosting.
Enabling Static Website Hosting
We can see the generated endpoint URL to access our static website, as soon as we select this option. Now below that, we will mention the following: “Index document = index.html, error document = error.html“.
#devops #aws #aws s3 #css #github #html #scm #website hosting
