S3 = Super Simple Solution ? AWS ftw : AppSpot

Friday, June 29th, 2012

Apple’s MobileMe, which was a great hosting deal, has been discontinued, and, unfortunately, there’s no price equivalent replacement for my tiny, low-traffic site. Amazon’s pay-per-use pricing tier is the next best thing. Being curious about Amazon’s claim that it’s easy to host static websites on S3, I decided to play with that a bit today.

Programs used:

  1. Web browser - Chrome (any browser will work)
  2. Website Designer - iWeb (any website designer program that can publish a static site will work)
  3. File Transfer - CyberDuck (any S3-enabled file transfer utility will work)

Services used:

  1. Amazon Web Services - S3
  2. Domain registrar - Hover

Step A: Create the structure in S3

  1. Log in to my free AWS Developer account using a previously created IAM user account. I’ll try to write an AWS permissions guide in the future to go into the why’s and best-practices for this step.
  2. Create a bucket, following the bucket naming guidelines so S3 knows where to send a person who types my URL into their browser. In my case, because my domain is mashruwala.org, this means naming my bucket mashruwala.org.
  3. Set the bucket type. The default is that S3 won’t let anyone access any bucket. To tell S3 that I want it to think of my bucket as a website and allow access to it, I click on the newly created mashruwala.org > Properties > Website and enable the Website feature. I also fill out the defaults for default and error pages (index.html and error.html, respectively), then hit Save.
  4. Add a bucket policy. The default is that S3 won’t let anyone access anything in any bucket, even if the bucket is accessible. To tell S3 that I want everyone to be able to access whatever’s in this bucket, I go to mashruwala.org > Properties > Permissions > Add bucket policy and paste in the below. Basically, it tells S3 that, by default for this bucket, I want everybody "Principal": { "AWS": "*" } who wants to read any object "Action": "s3:GetObject" from inside my root path "arn:aws:s3:::mashruwala.org/*" to be able to do so "Effect": "Allow". Since I want to remind myself what this policy does, I name it descriptively "PublicReadForGetBucketObjects". This is how the final result looks:

    {
  "Version": "2008-10-17",
  "Statement": [
   {
     "Sid": "PublicReadForGetBucketObjects",
     "Effect": "Allow",
     "Principal": {
       "AWS": "*"
       },
     "Action": "s3:GetObject",
     "Resource": "arn:aws:s3:::mashruwala.org/*"
   }
  ]
}
  5. Export existing site. The goal of this step is to get a copy of the website ready for uploading. Design programs like iWeb or DreamWeaver allow the designer to quickly work with abstract objects that then will need to become generated code in order for a user to view the website. In my case, I used Apple’s iWeb to create my site, "publish" the existing site to a local folder, then use a different program to upload the folder contents to S3.
  6. Upload content. I used the excellent CyberDuck to upload my content. Their AWS guide is here. CyberDuck comes mostly preconfigured for S3, so all I had to do is copy my IAM user’s Access Key into CyberDuck’s S3 username field, and my IAM user’s Secret Access Key into the password field, and hit connect. Once connected, I right-click mashruwala.org, select Upload, navigate to my published local folder, and off it went!
  7. Test endpoint. I test that Amazon is serving up my site correctly by going back to my browser window that is logged into S3 > mashruwala.org > Properties > Website and click on the Endpoint link. It correctly takes me to my site.

Step B: Repoint the Domain Name

For the internet to know where to direct someone who types my site’s URL in a browser, there has to be a little record somewhere that says, "Hey, I know mashruwala.org, and it lives in Amazon’s ecosystem". The name for this record is DNS Record.

For my site, this record lives in a domain registration company called Hover. I like Hover because it has a clean and sleek site, and changing domain forwarding to the Amazon S3 Endpoint (Step A7) is as easy as editing one field and clicking Save. Your domain registration company should have an equally simple process.

Step C: Prettify and update my website iteratively

I want to keep using iWeb to design my site. After adding any new content, I republish to a local folder (Step A5), upload to S3 (Step A6), and verify that it took (Step A7), and repeat as necessary.