Configure Amazon S3 to host a static web application

It’s rather simple to host an entire static website on Amazon S3. Typically S3 works out to be a low-cost, highly available hosting solution with automatic scaling built in.

To get started, first we will need to log into the Amazon S3 console and create a bucket for your web content. It is suggested to create the bucket with a name similar to your domain name. For example domain.com or example.com or justinfox.me. Once you have created the bucket, you should be able to select and view the bucket properties. A selected bucket should show a property section identified as for Static Website Hosting. Expand it, and select Enable website hosting, and set the default document to index.html. When done, click save.

You will need to configure your S3 bucket with the following bucket policy:

{
	"Version": "2012-10-17",
	"Statement": \[
		{
			"Sid": "CloudFrontPublicReadGetObject",
			"Effect": "Allow",
			"Principal": "\*",
			"Action": "s3:GetObject",
			"Resource": "arn:aws:s3:::example.com/\*"
		}
	\]
}

Don’t forget to update “example.com” with your bucket name. Otherwise the policy won’t work as expected. If you’re getting an error, you have probably misconfigured one of the above steps.

If you’re savvy with the AWS CLI tool, you can also do this process in your terminal.

aws s3 mb s3://example.com --region us-west-1
aws s3 website s3://example.com --index-document index.html
aws s3api put-bucket-policy --bucket example.com --policy file://policy.json
aws s3 sync . s3://example.com

This entire website is hosted in a git repo that is synced to Amazon S3. It’s built off of popular frameworks such as Bootstrap, FontAwesome, and AngularJS.