Website hosting on AWS S3 — The Most Secured way

There are 1000s of article that shows how to host website on s3 but none of them shows the most secure way. In this article I will explain you how you can host your website securely on s3 and server it from cloudfront and manage DNS from Route53

Prerequisites

• Already developed front-end application (AngularJS /React/ Vue etc etc or even HTML )
• An AWS account
• Less than 5 min of your time

CREATING A S3 BUCKET

Navigate to S3 Console and create a bucket. There are few article who recommend to have same name as the website name. This is not mandatory but its a good way

Bucket Name = Anything you wish preferred as your website name
Region = Your referred region

Once done, Click on Create

Allow permission as given and click on I acknowledge which will enable Next Button

Upload your code now to S3

Whats need ? Host website ????

yes I know you will be super excited to get your website live but as the blog suggest, we are more focus on securing our website along with hosting. So we first need to generate a SSL Certificate or incase if you have one we will then need to import them

USING AWS Certificate manager to get your free SSL

AWS Certificate manager is a recent AWS Service to give SSL For your website however this is not much open to all region. I would personally advise you to use Virginia region as all AWS Services are first rolled out there

So here we go with less than 5 steps to generate your SSL Certificate , Incase if you already have a SSL Certificate, you can just ignore the below steps and use import feature

Step 1 : Navigate to AWS Certificate Manager Homepage
Step 2 : Click on Request a certificate
Step 3 : Add domain names, You can add www.yourwebsite.com as well as yourwebsite.com and *.yourwebsite.com
Step 4 : Add Cname to your domain provider and if you are using Route53, this will be done in a click if not then add then on your Godaddy/Domain provider
Step 5 : Thats it. Once verified you will be seeing the status changed to Issued

Now that we have our code on s3 and SSL Certificate generated , then next thing is to create a Cloudfront distribution

WHY CLOUDFRONT DISTRIBUTION

There are couple of reasons why we use AWS CloudFront

1. Caching
2. Securing S3
3. Serving HTTPS
4. Connecting to your domain

How to get Cloudfront distribution for your website.

1. Goto CloudFront homepage in same region as you have your S3 Bucket.
2. Create Distribution and select “Web”
3. Under Origin Domain Name select your S3 Bucket
4. Restrict Bucket Access > Select Yes > and then Create a New Identity
5. For Grant Read Permissions on Bucket select “Yes, Update Bucket Policy”
6. For Viewer Protocol Policy, “Redirect HTTP to HTTPS”
7. For Allowed HTTP Methods select “GET, HEAD, OPTIONS” — NOTE: Please check your project requirements
8. Under Distribution Settings, Enter the website name you wish under Alternate Domain Names
   example — www.itsme.com and select your certificate from Custom SSL Certificate
9. Default Root Object set to whatever is the entry point of your website. usually its index.html
10. Click on create distribution .

Where we are almost done we still have 2 more steps pending. Thinking what are they ?

Setting proper error pages and point the domain for end users to access your website

Click on your distribution and go to error pages tab and click on create custom error response . I always set 404 and 403 to 200 OK so that but you can add them more depending on your project and click on create once done.

We are all set to go live ! All we need now to do is point domain to your cloudfront distribution

Cloudfront gives you a unique address something.cloudfront.net but we don’t want our end users to use this. So we added a CNAME while creating a distribution. All we neeed to do is create a CNAME point to this distribution and wait for DNS to HOP !

Holla ! We have now successfully and securely hosting our website on AWS