How I served 100k users without breaking the server- or a dollar bill.

Or, “The incredible, affordable S3″

Screen Shot 2013-04-26 at 11.41.51 AMI made a silly thing. The Associated Press’s Twitter account had just been hacked and sent out a fake tweet about an explosion in the White House. The Dow Jones immediately dropped 150 points. So I made a silly thing. It’s called “Is My Twitter Password Secure“, and the best description I could probably give it is a PSA on phishing sites. Try it, you might laugh. If you’re like many people, you’ll be so convinced by it that you’ll send me abuse on Twitter. That’s OK.

But anyway, it “went viral”. Tweet after tweet arrived in my “mentions” box as people enjoyed the joke and shared it with their friends. Despite being hammered with requests, the server never slowed and never crashed. Because there was no server. At least, not that I had to worry about, because I hosted the entire thing on Amazon S3. Not only is it super-reliable, it’s also super cheap- serving 758,509 requests cost me… thirty cents.

Screen Shot 2013-04-26 at 11.41.58 AMOf course, you can’t run any dynamic scripting on S3, but you’d be surprised the number of times you don’t have to. For example, the promo site for my taxi app does use dynamic content- the map tile images are generated by an EC2 instance I have running TileStream- but the vast majority of the page runs quite happily on S3. JSONP or CORS mean that you can quite effectively run an ‘API’ server on an EC2 instance, while leaving the majority of your static HTML on an S3 bucket.

While the steps to set this up aren’t complicated, I thought it might be worth creating The Definitive Guide To Hosting A Web Site On S3.

The Definitive Guide To Hosting A Web Site On S3

The steps are actually really quite simple- make a bucket, set up a CNAME, upload your files. But let’s go one by one:

Make a bucket

Every domain name you want to use has to be a different bucket. Make the name of the bucket the exact domain name you wish to use (including the subdomain, like www.):

Screen Shot 2013-04-26 at 11.25.36 AM

Then you need to make this bucket publicly browsable. Select your bucket, and open up the Properties tab. Under ‘static hosting’, you just need to check “Enable website hosting”:

Screen Shot 2013-04-26 at 11.29.21 AMYou’ll notice that there is also a box for ‘index document’ – you ought to be fine to leave this as it is (no point trying to host PHP files on here, folks) but if you’re one of those people you might need to change it to “index.htm”.

Ta-da! You now have a static web site up and running.

Upload your files

Unfortunately, S3 doesn’t offer anything so simple as FTP access. That said, there are many clients out there set up for S3 uploads- my personal favourite is Cyberduck, it’s donationware, and supports just about every uploading scenario you could wish for. All it needs is your AWS API key and it’ll list all your buckets out for you, and let you drag and drop your files straight into your bucket.

Get a better domain name

That endpoint URL is pretty gross. Thankfully, it’s very simple to get a better one mapped to your S3 site. I’m using Namecheap in these screenshots, but any DNS provider ought to be able to do the same thing. Go to edit your DNS records, and add a CNAME record for your chosen subdomain that points to your gross endpoint URL:

Screen Shot 2013-04-26 at 11.37.51 AM

That ‘IP ADDRESS/ URL’ field’s full value is www.ismytwitterpasswordsecure.com.s3-website-us-east-1.amazonaws.com. – that last full stop on the end is important. And the URL redirect above simply directs all users to the www subdomain if they haven’t already entered it.

And that’s it. Your static site is up and running on your pretty domain name. Now you’re free to play horrible tricks on the world without worrying that they’ll crush your server and/or wallet in return. Use this power wisely.

  • Louis St-Amour

    You could likely save even more money with DreamObjects: http://dreamhost.com/cloud/dreamobjects/ though we’re nickel and diming here ;-)

    • Len Jaffe

      Getting pretty sick of dreamobjects spam. Actually considering moving off of dreamhost as a result.

      • http://www.ryankearney.com/ Ryan Kearney

        I tried DreamHost once and had to file a chargeback to get my money back less than 3 hours after signing up. They refused to give me back my money. Their excuse was that the $10 I paid actually went towards the domain name, which is non-refundable, instead of the hosting plan (which offered a FREE domain name). Luckily my credit card company saw differently.

        Their control panel is written in Perl and is the most barbaric thing I’ve ever seen. Upwards of a 30 minute wait time for an email account to “provision”. This is 2013, why are we waiting for something that should be instant? It’s all garbage.

        • Len Jaffe

          > Their control panel is written in Perl

          ZOMG! Not Perl! What were they thinking?

          > and is the most barbaric thing I’ve ever seen.
          > Upwards of a 30 minute wait time for an email account to “provision”.
          > This is 2013, why are we waiting for something that should be
          > instant? It’s all garbage.

          So you would have liked them to run more clients on the consuming end of the queue?

          • http://www.ryankearney.com/ Ryan Kearney

            >ZOMG! Not Perl! What were they thinking?
            I canceled my account because the Control Panel was unusable. Anything I tried to do resulted in a Perl error being spit out instead of the relevant Control Panel page.

            >So you would have liked them to run more clients on the consuming end of the queue?
            It takes no time at all to “provision” an email account. Do you have to wait 30 minutes for your Gmail/Yahoo/Microsoft email account to function? No, and they have MUCH larger volume than DreamHost. No other webhost I’ve used have ever had a “waiting period” for an email account to “provision”. It’s a sham.

          • Aaron Murray

            This was relevant experiece years ago. None of this applies to Dreamhost as it exists today. I use the control panel regularly with no errors, and I just recently added an email address and had almost no wait for it to provision.

          • Len Jaffe

            But…Perl!

          • Len Jaffe

            > I canceled my account because the Control Panel was unusable.

            > Anything I tried to do resulted in a Perl error being spit out instead

            > of the relevant Control Panel page.

            They put broken code in production, and it’s the Perl’s fault. Would it have been python’s fault, or Ruby’s, or Java’s?

            > It takes no time at all to “provision” an email account.

            Did you ever ask then why it took so long?

      • Louis St-Amour

        I see I was downvoted. I wasn’t spamming, though. No affiliate codes, nothing. Just wanted to point out the pricing. Thanks, Internet.

    • http://twitter.com/DuncanMacWeb duncan mac { w₃ }

      Thanks for sharing, Louis. That’s a great tip. :) Plus, DreamHost is carbon neutral by offsetting. Another great choice would be GreenQloud’s StorageQloud, which runs entirely on renewable energy.

  • andrewmunsell

    If you’re wondering how to actually build a static site to host on S3, I actually have a tutorial on using Jekyll, a static site generator, to build a website: http://learn.andrewmunsell.com/learn/jekyll-by-example

    It also goes over similar content to this blog post, as well as how to use Dropbox to host the website.

  • Zay Johnson

    Please make a social plugin for your post I really wanted to share this. Thanks! Great Post!

    • http://twitter.com/kylesethgray Kyle Gray

      you can just copy and paste the link…

  • http://taigeair.com taigeair

    thanks for the detailed writeup.

  • ricardobeat

    Or you can just host it for free using GitHub Pages: http://pages.github.com/

    • Aaron Murray

      Does that solve the scale side of the problem? (I haven’t used them so I don’t know.)

      • http://www.facebook.com/Introducing.TJB TJ Biddle

        Scale? AFAIK github pages will scale as much as you need it to – without any cost. And they’re *fast*. I actually just switched one of my sites over due to this comment (After just switching to S3 after reading article, lol).

      • ricardobeat

        GitHub serves billions of views/month, so anything you throw at it won’t even register as a blip.

  • ajoines

    so how much does it cost to setup an account ?

  • Pingback: SummerStage 2013 App: SummerStageHand.com | danwin.com

  • Pingback: Improve the performance your WordPress blog or web with WP Super Cache + Amazon S3 Cloudfront CDN solutionqstion - Blog | qstion - Blog

  • U

    I don’t know if S3 worked differently when you set this up originally, but as it is today the instructions above are incomplete in that your web site’s bucket needs to have a ‘bucket policy’ added to it in order for the files within to be publicly accessible. Described here: http://docs.aws.amazon.com/AmazonS3/latest/dev/HostingWebsiteOnS3Setup.html

    Without that policy, you’ll just get a ’403 access forbidden’ error.