Amazon Web Services is an intimidating thing. After all, some of the largest, most active websites in the world are hosted there. But that doesn’t mean hosting a website there needs to be difficult. In fact, as AWS has matured over time and now it’s at the point where anyone with a minimum level of technical understanding can host a site using AWS.
Because this is the beginner version of the tutorial, we’ll use the Quickstart tool linked to above. It’s super easy to use, but makes a few decisions for you that professional’s might not agree with. But, trust me, I’ve used it dozens of times and it works great.
So login to your AWS console or click the link. Tell AWS that you’d like to create a new site. You will see the following:
Regardless of the option you choose, you then create your site. At this point you will be sent to the main screen. Here you can see a preview of your site, give your site a domain name using Amazon’s Route 53, check your CloudFront (Amazon’d CDN status), or update the site. If you don’t want a custom domain name, you’re actually all set right now! AWS will provide you with a link that looks like this: https://randomlettersandnumbershere.cloudfront.net. That might be ugly, but it’s a fully functional link to your site!
The setup of all this should take Amazon about 10 minutes, after which your site is fully set! You’ve made a website and hosted it on AWS!
If you want to update your site, just go back into the Quickstart tool and drag a new .zip files onto the page. Amazon will uncompress the file, read the contents, and tell you how many files are changed from your previous build. If you accept the changed your site will be updated with the new files.
If you want to edit the files, review the contains of the site, management permissions, delete files, or delete the website entirely, then you will have to go to S3 to do that. After all, all the Quickstart tool does is give you an easy way to use AWS’ S3 and make a few choices for you. Any sort of manipulation or advanced features will be done through the standard S3 toolset.
OK, so the static site is built but now it needs a domain, like MySite.biz. You can buy the domain from wherever, but for our example we’ll be using Route 53, Amazon’s DNS and domain name buying service. This is very simple to do, just go to Route 53 and buy a domain. Now do to your website in the AWS Quickstart tool and in the “Domain” box choose to “Buy a Domain.” Choose this even if you already bought one (Amazon didn’t get the language right here). You’ll get this:
Since you already have a domain name you just need to select the domain from the resulting dropdown and associate it with the static site. You can buy one from here as well, but you planned ahead, right? With the domain already purchase, you just select it from the dropdown and associate it with the S3 bucket where your site lives.
Not the subdomain field at this point. You can put whatever you want there or you can leave it blank. The most popular option will be leaving it blank, while some people will want to have the default entry of their site start with “www.” Both are great options, but you will have to account for this choice later. You could add another subdomain here as well, like example.MySite.biz.
Let’s leave the subdomain blank and move on to other things.
Here is a working example of an S3-hosted static website.
With the domain associated, you have a working website, but the www version of the site will create an error. As great as the Quickstart tool is, it doesn’t account for this, but it’s an easy fix.
Hop over to the S3 console — you’re see your static site in there! — and create a new bucket. Name it “www.MySite.biz”.
Now click into that bucket and navigate to the Properties tab. You’ll see a menu in there that says “Static website hosting.” Open this and choose the option that says “Redirect Requests” and then type in the domain name you associated with your static site’s S3 bucket. In our example we’d type in “MySite.biz” and hit Save.
What we’re doing here is creating a second S3 bucket that forward people from www.MySite.biz to MySite.biz. This works for any visitor to the site, including the GoogleBot and others. You will have a fully functional site and while you can’t use www. this subdomain will technically be fully functional and adherent to web standards.
At this point you have a static website hosted on AWS. You can revel in that for a moment because it’s a pretty incredible thing. The cost of the site will be nearly zero — S3 storage is free or practically free, the Route 53 hosted zone is $0.50/month, and bandwidth is cheap. You can roll out dozens of site and you will barely see a bill unless you are moving around lots of and lots of files or seeing massive traffic. And in addition to being cheap, your static site should be highly secure and have great performance thanks to S3.
In upcoming articles we’ll take this from Easy Mode onward as we run through some next steps, such as HTTPS handling, bucket policies, and CloudFront setup.
Update: Confused about your DNS? This article explains hosting an S3 site with Route 53 DNS
Sal Cangeloso December 6th, 2017
Posted In: AWS