Abstract

This static website delivers content directly sent to the user from a server without any dynamic processing or server-side changes. with the use of Amazon cloud storage, you can design the website to your ability.

Table of Contents.

Introduction.
Steps taken in creating a static website.
The use of VS Code.
Website Output
Conclusion.

INTRODUCTION.

Amazon S3 (Simple Storage Service) is a cloud-based object storage service offered by Amazon Web Services (AWS). It allows users to store and retrieve any amount of data, at any time, from anywhere on the web. Think of it as a highly scalable, reliable, and secure online hard drive for your data.

The use of a Static Website can easily be created from an Amazon S3 bucket, and it will be illustrated in my steps as we go ahead. This hosted Amazon S3 static website is where the content is primarily static HTML, CSS, and JavaScript files, without any server-side code. Essentially, S3 acts as a file storage service that can also be configured to serve these static web files directly to users via a web browser.

What are the benefits of using Amazon S3 for Static website hosting?

It is scalable for usage; this means that you can store virtually any amount of data, up to exabytes, in S3 with unmatched performance, for it is fully elastic, automatically growing and shrinking as you add and remove data, and there’s no need to provision storage, for you pay only for what you use.
It is durable and available for usage at any time; that is, Amazon S3 provides the most durable storage in the cloud and industry-leading availability. Based on its unique architecture, S3 is designed to provide 99.999999999% (11 nines) data durability and 99.99% availability by default, backed by the strongest SLAs in the cloud.
It’s high security and data protected. It protects your data with unmatched security, data protection, compliance, and access control capabilities. S3 is secure, private, and encrypted by default, and also supports numerous auditing capabilities to monitor access requests to your S3 resources.
It delivers multiple storage classes with the best price performance (pay-as-you-go basis) for any workload and automated data lifecycle management, and delivers resiliency, flexibility, latency, and throughput to ensure storage never limits performance.
It delivers multiple storage classes with the best price performance (pay-as-you-go basis) for any workload and automated data lifecycle management, so you can store massive amounts of frequently, infrequently, or rarely accessed data in a cost-efficient way. S3 delivers the resiliency, flexibility, latency, and throughput to ensure storage never limits performance.

STEPS TAKEN TO CREATE A STATIC WEBSITE

Step 1: Make sure you have an AWS account and log in to your account, and click on the S3 console as shown below.

Step 2: Click on create bucket as shown below, follow the prompt, choose a bucket name, object ownership (ACL-disabled), and uncheck block all public, leaving every other portion the same, and click on create bucket.

Step 3: Now our bucket has been created, and we need to set the object policy. Click on the bucket as shown below

Step 4: To set the bucket policy, click on permission and click on edit at the bucket policy as shown below.

Step 5: The JSON Bucket policy generator is needed here so as to allow access to the public for the S3 bucket. Select S3 bucket policy, principal (type ), All Actions - select GetObject, Amazon Resource Name (ARN)—copy ARN/* and paste, click on add statement, and click on Generate policy. The JSON output is as shown in the next capture.

Step 6: After copying the JSON code, paste it into the bucket policy and share for accessibility.

THE USE OF VS CODE.

A CeeVee-free responsive website template was shared for use; this was downloaded and extracted as shown in the download file below.

Thereafter, I went back to my AWS S3 bucket to create a static website hosting under properties, where edit static website hosting was clicked and included index.html and error.html with save changes as shown below. Open VScode and click on new file, we later move to the download folder and select folder button so as to open the folder in the VS code environment and click on new file and type error.html as shown below.

Kindly note that the error.html is when a browser requests a service from a web server, an error might occur, and the server might return an error code like "404 Not Found”. The CeeVee code was shared and was pasted in the space provided at the error.html path, and when movedd to the index.html path, which will always start with DOCTYPE html.

WEBSITE OUTPUT

The website output is a result of the CeeVee work procedure, as stated above, and it’s as displayed and shared below with its URL output.

https://chibox.s3.us-east-1.amazonaws.com/ceevee/index.html#home

CONCLUSION.

This project was successful with a practical application demonstration of the Amazon S3 console portion as a scalable, durable, and secure solution for cloud-based data management, with more understanding of incorporating VS Code with the AWS environment to produce a static website. Also, this project provided a solid foundation and understanding for utilizing Amazon S3 for various data storage and management needs. Understanding S3 allows for the design and implementation of efficient and secure cloud storage solutions in AWS.

Hosting a Static website on AWS S3.