Easy Way: Static Hosting with Amazon S3 and Cloudfront

Step by step tutorial for creating an static website using Amazon S3 and Cloudfront in just a couple of minutes.

Easy Way: Static Hosting with Amazon S3 and Cloudfront

Some weeks ago, we analyzed how to set up a static website using Amazon S3 and Amazon CloudFront manually.

Static Hosting with Amazon S3 and Cloudfront
The decision of moving from a “Standard” Web hosting to a Static Hosting is influenced mainly by two facts. 1. Performance. 2. Cost. Static hosting allows us to serve a blazing fast service, at a very low budget. Not all applications are suitable for static hosting, and not all the

We learned to use the dashboard of each service and how to configure the basic parameters needed for our setup. In this new tutorial, we will be using Amazon Cloud formation.

Amazon Cloud Formation is a service that allows us, to create and manage a collection of related AWS resources. It is like a predefined configuration of several services connected together to work in the desired way. In this case, a static hosting and global distribution with both Amazon S3 and CloudFront.

Before starting, on our main dashboard from the AWS Console, we can find some useful CloudFormation Templates created by Amazon Web Services. Those can be found in Build a solution, under AWS Services.

For starting the tutorial, we will click on Host a static website (With S3, CloudFront, Route 53
~5 minutes). A new page will show up, with all of our websites created with this wizard. For setting up a new website, just click on New Website button.

On the new window, insert the name of the webpage (this name will appear on the previous page, where all our pages are shown). And select Your Website under How do you want to start?. Once done, click on "Create your website".

DONE! Wait some time for the system to upload your website to S3 and to start the distribution on CloudFront. It may take 15 mins approximately to set up everything.

On the same page, we will be able to re-upload the content of our website and our CloudFront domain that later can add to our custom domain or to Amazon Route53. After some time, a live preview of our page will appear.

If we have our domain with Amazon's Route53 Service, we can set it up using the Buy Domain button. This will allow us both, to buy a new domain and use it, or to use an already owned domain.

We can edit any parameter we want on S3's dashboard or in CloudFront's dashboard. But the basic setup is already done and configured by itself. Easy right?

Be sure to comment any question or suggestion in the comments.