Hartley Brody

Moving a Static Site to S3 Before My Girlfriend Got Out of the Shower

I’ve got an old Rackspace instance that I’ve been running a bunch of small sites on over the past 4 years. Lately it’s been causing me problems and sites will sporadically go down from time to time.

I have been meaning to move several of the static sites onto a more appropriate static-file hosting service like Amazon’s Simple Storage Service, also known as simply “S3”.

I’m on a trip in Denver with my girlfriend right now, so when I woke up to an email that one of my sites was down again, the last thing I wanted to do was waste precious vacation time doing server ops.

Woman in the shower

Fortunately, moving the static sites to s3 was so easy, I was able to get it done before my girlfriend even got out of the shower. No vacation time wasted!

0. Create an Amazon Web Services Account

I already had one so I didn’t need to do this step, but it does take a few extra minute to get signed up. I believe you still need a credit card to sign up, but if you’re doing less than 20k GET requests per month (including requests for each CSS/JS file) then hosting your site on S3 is free.

1. Create a bucket called mydomain.com

30 seconds - The bucket has to have the same name as the hostname you’ll be pointing to it. Choose a region and Amazon will automatically create a bucket URL for you like:

mydomain.com.s3-website-us-east-1.amazonaws.com/.

create-s3-bucket

2. Upload your static files

30 seconds - Since my site only has a few files, I used Amazon’s interface to upload them. Note that my homepage document is called index.html but any file name could work. You’ll set that in less than a minute.

upload-static-site-files

3. Make all files public

10 seconds - You’ll need to instruct Amazon to allow the files in your bucket to be downloaded by anyone on the internet, otherwise visitors will see a “403 Forbidden” error when visiting your site.

Just check the box next to each file and then go to Actions > Make Public and click “Okay” on the confirmation screen.

make-static-files-public

4. Enable static website hosting for the bucket

30 seconds - In order for S3 to return files from your bucket when requests are made for your domain, you’ll need to turn on static website hosting for this bucket.

Click “All Buckets” at the top, and then right-click on your domain’s bucket and click “Properties”. Open the “Static Website Hosting” and click the dot to enable static website hosting.

static-website-hosting-settings

You’ll need to enter the name of the file that you want visitors to see when they navigate to the base path like http://mydomain.com/ so that you don’t need to add /index.html to the end of all of your URLs.

5. Point your site’s DNS at your S3 bucket

2 minutes - At this point, you should be able to visit your bucket’s Amazon S3 URL and see your website. Now you just need to point your site’s current domain at your S3 bucket so that your site’s visitors hit your S3 bucket instead of your current web host.

If you’re using Route 53 – Amazon’s DNS service – you create an A record for your domain, make it an alias, and then point that alias at your site’s S3 bucket. More instructions here.

Amazon's Route 53 instructions

Since I use Cloudflare to manage the DNS records for the site I was moving and they support CNAME flattening, I just made a CNAME record for my domain and made its value the full S3 URL to the root of my bucket.

dns-settings-point-to-s3-bucket

Voila, you’re done in less than 5 minutes.

By the time she’s drying her hair, your site will have 99.99% uptime, and 99.999999999% of durability (yes, 9 nines), you won’t pay anything for hosting if you’re doing less than 20k file requests a month, and you won’t have to waste any more time messing with servers.