Ideally, I would like to replace the role of Vercel in my stack with AWS services. That means I have to find a way to replace the following features:
Let’s knock off something easy and something that we can quickly see. Using S3, I can get a 100% replica of my live blog by hosting the generated static site within a bucket configured for web hosting. To configure a bucket, I just followed the defaults within the S3 Bucket Creation wizard with the exception of the following:
I now have an S3 Bucket that can be used to serve a static website. If I run bundle exec jekyll serve
within my local project, I will be given a _site
directory that contains the static assets needed to serve my blog. What left is to put the contents of this directory. That should be simple enough, right? Let’s just open the Bucket’s file dialog, CTRL+A
the directory’s contents, and we’re pretty much done…
Nope! You apparently cannot upload directories using the S3 Bucket wizard. We are engineers, we shouldn’t be using the UI that much. Let’s use the command line instead!
If you’re going to do a decent amount of work with AWS services, you’ll be pretty inefficient (and probably error-prone) if you spend your time using the every changing web interface of the AWS Management Console. The AWS CLI provides unified access to all AWS has to offer. Let’s take advantage of it by sycning our S3 Bucket with the contents of the _site
directory. After making sure that you have configured your account, we just need to enter the following command:
$ aws s3 sync _site s3://bucket-name
At this point, you can now access your S3 Static Website! You can find the URL under Properties -> Static website hosting. Here’s mine: http://alcher.dev.s3-website-us-east-1.amazonaws.com/
We didn’t have much parity with our Vercel setup, but we did accomplish a lot – particularly a static website with high availability using S3 Buckets. Here’s our setup so far:
Let’s see what we can further improve. I’ll see you on the next one!
Got any feedback or suggestions? Feel free to send me an email or a tweet.
Ciao!