Static Websites for a Better Tomorrow

Jared Short Trek10
Jared Short | Aug 24 2015

Mon, 24 Aug 2015

The bytes that make up the page you are reading right now were delivered by a set of servers close to you. They were not generated by a server running WordPress or Joomla. In fact, the entire Trek10 website has no traditional server backend at all.

No server, how is this possible?

Amazon S3, CloudFront, and a Static Websites. It’s what I consider the trinity of this delicious web-based jambalaya. The Web Trinity.

But first, a quick background on Static Websites. Static Websites is a set of files (HTML, CSS, Javascript, and images). It doesn’t need any processing on a server to serve each page view. The assets remain unchanged for each view, thus “static”!

Writing raw HTML, CSS and Javascript? Why not just use Notepad and go back to the dark ages while we are at it? WordPress and Joomla make it so much easier to manage websites. Yeah, we agree. That’s why bright people created Static Website Generators. Static Website Generators allow you to take advantage of the good parts of CMSes like themes and templates. It also lets you take advantage of raw HTML, CSS, and Javascript with things like no database requirements, and you can version control your source code. There are a whole bunch of Static Site Generators out there, but at Trek10 our preference is for Jekyll.

Jekyll enables a simple workflow for the Trek10 team. Write content, commit to GitHub, click button topublish. Done. No database, no server. Write, commit, publish.

Cost analysis for the cost sensitive, it sure sounds expensive!

C’mon now, you know us better than that. We aren’t the type of people to put raisins in chocolate chip cookies. Let’s do some cost analysis on our 100% chocolate chip cookies.

Running even a small system like WordPress or Drupal will cost at least $20/mo in AWS. It will also give you no redundancy. You could spend $50 - $100/month, or more running a scalable and high availablilty CMS — not to mention the setup time. If you’re not an AWS expert, that could take you days or weeks to set up.

So with a baseline of $20, let’s look at the Web Trinity. It costs pennies. Well, maybe dollars if you achieve huge success. Let’s say your website has 1 million page views in a month. That’s roughly 2 million eyeballs reading your content. Assume that each page view makes 15 HTTP requests, and that the whole page is 50kb. With CloudFront, you’d pay for 50 GB of transfer and 15 million requests. That would cost about $15 a month for U.S.-based traffic, and a bit more for traffic from other countries. With reasonable caching between S3 and CloudFront, the S3 costs are trivial.

$15 a month to serve 1 million pages that could handle SuperBowl levels of traffic. In reality, we are talking a couple bucks a month for most levels of traffic.

Sounds Hard for Non-Developer People!

I won’t sit on my throne of developer and AWS skills and lie to you. The initial setup can be a bit tedious and take a non-trivial amount of time. You have to setup an S3 Bucket, configure a CloudFront distribution, setup a Jekyll environment, install the dependencies, and bootstrap the initial website. Only then, can you finally start writting content. Scared off yet?

I would like to introduce you to something we built at Trek10.

Introducing Jekyll Rocket

Check it out on GitHub

StarWatchFork

We built this set of practices for high performance static websites, and we use it ourselves. We think you should too. It’s fast to get started, and you’ll deliver stellar performing websites that are pretty darn easy to maintain, thanks to Jekyll. It’s about as turnkey to set up as you can get. All the hard AWS configuration is handled with the AWS CloudFormation template and guide we provide, and the Jekyll environment is a couple commands in your terminal.

We spent a lot of time thinking, experimenting, and making things as straight forward as possible.

You just have to plug in a few configurations here and there (don’t worry, we even tell you where to get the values for the configs), and away you go.

Here’s what some people say about Jekyll and the Web Trinity.

Jekyll Rocket has been great to work with. No dancing around in a "pretty" UI that limits our ability to edit our site. Our team can commit updates and make customize our site on a moment's notice.**Trek10's VP of Sales & Marketing and Non-Developer Type Person
Nick Caston**
No Server Required. Amazon S3 FTW!**Amazon's CTO
Werner Vogels, on Jekyll & S3**

Convinced? Ready to get started now? Checkout the QuickStart Guide on GitHub to get going.

Even better, we produced a short screencast for those visual learning people out there.

Questions? We'd love to hear them. Comments? Shoot them our way. Corrections? The Jekyll Rocket github repo is open for pull requests.

Author