Hi guys.
In this post I'll explain how I managed to set up my static web site using AWS.
The complete tutorial can be found in the official website here.
I followed all those steps, and at the end include my owns on how to improve the website, with SSL certificate and using https.
In order to deploy a basic static website using AWS we are going to use two main services:
Amazon Route 53: To register the domain and to route internet traffic.
Amazon S3: We use Amazon S3 buckets to upload the website content and configure the bucket to allow incoming traffic.
CloudFront: We configure CloudFront to distribute the content using https.
Certificate Manager: To obtain an SSL certificate for the website.
1.- Register a Domain
If you have already a domain, such as example.com, you can skip this step. If not, you can register a domain using Route 53. The price is around $12 per year. There could be options more accessible outside AWS but using Route 53 is just more convenient if you plan to integrate several services.
2.- Create buckets
Create two buckets, for the domain and sub domain:
Domain: example.com
Sub domain: www.example.com
The root domain bucket (example.com) will host all the content, and Amazon will redirect all the request to www.example.com to the root domain.
NOTE: Remember in which region are you deploying the bucket, because that determines the Amazon S3 website endpoints.
3.- Configure Root Domain Bucket for Website Hosting
Activate the option Static Web Hosting in the root domain bucket (example.com)
4.- Redirect Sub domain Request
Now configure the sub domain bucket to redirect all request to the domain.
Target bucket or domain: example.com
5.- Upload Index and Website Content
Upload all the content to the root domain bucket, we can use a simple html to test this:
6.- Making the Bucket Public
NOTE: This setting will make the bucket and all its content available to whoever access the website. Be careful of what you upload.
7.- Attach Bucket Policy
{ "Version":"2012-10-17", "Statement":[ { "Sid":"PublicReadGetObject", "Effect":"Allow", "Principal":"*", "Action":[ "s3:GetObject" ], "Resource":[ "arn:aws:s3:::example.com/*" ] } ] }
Now that the bucket is public, we only want people to have permission to read. Using a policy is possible to accomplish that.
8.- Test Endpoints
When accessing the bucket permission, we can get the endpoint of the bucket, or we can build it using the following formats (remember to update the bucket name and Region):
http://bucket-name.s3-website.Region.amazonaws.com
http://bucket-name.s3-website-Region.amazonaws.com
9.- Getting an SSL Certificate
Is possible to access the website now, but it will be using the endpoint URL, using http and no SSL certificate, making it very insecure.
We can use Certificate Manager to create a SSL certificate for our domain. Enter Certificate Manager and follow the steps to Provision a certificate, and don't forget to register both domain and sub domain (example.com and www.example.com):
Request Public Certificate
Choose DNS Validation
This will take some time.
10.- Configure CloudFront
Using CloudFront we can deliver our content using https, as S3 buckets only support http on website mode.
Create a new distribution for web. In this step we need to be careful to configure the distribution in the right way. Don't worry if you get it wrong the first time, you can restart and edit the configuration anytime.
For Origin Domain Name use the root domain endpoint.
Viewer Protocol Policy choose Redirect HTTP to HTTPS.
For Maximum TTL 0 (We can set this higher when we don’t plan to update the website too often.)
Price Class Use All Edge Locations
Alternate Domain Names both the root domain and the subdomain.
SSL Certificates Custom SSL Certificate, and choose the one created in Certificate Manager. In case you can't see it enter with root user to AWS and wait some minutes after creating the certificate.
Save.
After some minutes, the status will be changed to Deployed in the CloudFront Distributions page, and you can use the domain name to enter the bucket, something like abc123.cloudfront.net
Why all this?
Now we have our web content in a S3 bucket, a CloudFront distribution to deliver our content using HTTPS, as SSL certificate for our domain, and Route 53 with our domain ready to configure the redirection. So, here is a little diagram showing how is done:
11.- Configure Route 53 to CloudFront
Using Route 53, create a New Hosted Zone with the domain name.
Once created update the records in the following way:
You should have a record for the domain example.com and www.example.com with the alias set to the CloudFront URL, as well as the CNAME record.
After everything is configured correctly, when you enter www.pecobe.com it will be requested using HTTPS and display the SSL certification.
