Hosting a website on S3

Hosting a website on AWS S3

How to set up a static site on AWS S3.

If you have a static website and you’re trying to make sense of AWS’s documentation, this will give you a visual step-by-step guide to get up and running.

Step 1 - Create an S3 bucket

  • Login to your AWS console and navigate to S3
  • Click the Create Bucket button. The most important thing when you create the bucket is the name - it should be exactly the same as the domain name. For example, you can see bucket name for this site is paul.copplest.one
  • When choosing the region, choose the location that’s closest to your site’s visitors

alt text

Step 2 - Change the bucket to a “Static Hosting” bucket

  • Now click Properties then Static Website Hosting
  • Fill in the relevant Index Document (homepage) and Error Document (which is usually a 404 page)

alt text

Step 3 - Make all uploads accessible to the public

  • Click on Permissions and then Edit bucket policy (image is below)
  • In the popup, enter the code below, but change example.com to match your bucket name
{
	"Version": "2012-10-17",
	"Statement": [
		{
			"Sid": "AddPerm",
			"Effect": "Allow",
			"Principal": "*",
			"Action": "s3:GetObject",
			"Resource": "arn:aws:s3:::example.com/*"
		}
	]
}

alt text

Step 4 - upload your website

  • Now click into your bucket (by clicking the name of the bucket on the left hand side)
  • Click Upload
  • Drag all your files onto the popup and click Upload. You can see the full GIF below

alt text

Final steps - point your domain to the bucket

If you have done everthing correctly you should have a functioning website. To test this out click on Properties again, then Static Webite Hosting and click on the Endpoint URL. This will open your website in a new tab - remember this URL as you will need it below. The specific instructions on how to point your domain name to this bucket depend on who you host your domain with so I will have to give only general instructions:

  • Go to the control panel for whoever you have registered your domain name with
  • Go to the DNS management section
  • Create a new CNAME record
  • For the “host” you will probably need to put the “catch all” character which is usually @
  • In the “value” you should put the Endpoint from above. Make sure that it doesn’t have http:// at the front or a trailing slash
  • Wait ten minutes then visit your domain :success_kid: