Do you know you can host your website on AWS and distribute its content across the globe all in minutes.
Tags: website, s3buket, cloudfront, beginners
Published: 2022-07-19 01:34:04

An online presence is not an optional strategy for an individual,company or corporate organisation in fact, a reliable hosting service provider is of utmost importance.
You can host your static website on AWS and have your content seen global as it distributed.
AWS does this easily, as you load your files into the AWS environment using a resource called Simple Storage Service called "S3" for short a scalable storage service in the cloud.
S3 is a object storage service that has high scalability and availability,hosting your website in S3 assures security,speed and protection against data loss.
S3 hosts the the website and  Cloudfront delivers your content to visitors of your site.

The first step is to login to your AWS console and search S3:


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/7xipm57mdqodchswwho4.PNG)

Then you click s3 and create a bucket :

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/oy5r7721hpdnu27sudvw.PNG)
 
To create a bucket and give it a unique name:

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/k8lanapcetu319z4py5a.PNG)

Make sure you affirm ownership of the bucket by enabling ACLs:![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/4rph39dcxdi6ec6ae1rx.PNG)
 
Then you go on to uncheck "block access" this disables the bucket from being access so you need to uncheck it:
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/6faxnah9olzpim2g4mmt.PNG)

  AWS would what you to affirm that you are aware of the settings and changes you have performed by acknowledging this, then you create a bucket.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/6mbhvx4ll8colcilf6k3.PNG)
 
After you have created the bucket you go to properties scroll to enable static website hosting edit and enable:
 
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ciam5rn3bmse2h5qfxwt.PNG)



Scroll down through the page and search for index document and error document and write index.html and error.html respectively save changes and success.

Inside the bucket, still go on to tabs and click permissions scroll down to bucket policy and edit and apply the bucket policy:

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/3uubocoyh1vhfh4ygkjr.PNG)
 Edit the policy by replacing resource line were "my bucket" is with your bucket name.
The bucket policy to be applied  can be found [here](https://docs.aws.amazon.com/AmazonS3/latest/userguide/WebsiteAccessPermissionsReqd.html)save your changes.

Then you move on the tab that has object,upload your files, not files one by one not the folder starting with the index.html:

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/8gkc276pim6vk0f2jj1b.PNG)
After you have successfully uploaded the files, go on to the property tab an endpoint has been created.Click to copy the link and paste to a browser.
A [website](http://yinkaboo.s3-website-us-east-1.amazonaws.com) is displayed.
The website has been successfully hosted in the bucket,to get website and the content out there globally with speed, you can use  another AWS resource called [Cloudfront].(https://aws.amazon.com/cloudfront/url).Cloudfront uses edgelocations to make distributions.
You go the console again and search bar and look for Cloudfront,when you get there you create a distribution.The distribution enables you chose the source data you want to distribute and the location you want to send it too.
Cloudfront does different type of distribution including Web distribution and RTMP.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/5b1udav4lrip4mbbybqx.PNG)
 A distribution is created and the website delivered on Cloudfront and the website is seen in this [link](https://d25u5lgaayn97i.cloudfront.net) 
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/exb0ho5i6m8u6z8u6s2h.PNG)

The website is now accessed through Cloudfront distribution for all to see.


Architectural diagram of the website hosted and distributed by Cloudfront inspired by @stuart_a_scott 



![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/z6osbk6thwpydnzfe1m7.png)