Coding Challenge #77 - Build Your Own Static Site Generator

Coding Challenge #77 - Build Your Own Static Site Generator

This challenge is to build your own static site generator, i.e. something like Hugo (an open source static site generator built in Go).

Static site generators are a useful tool for those of us who want to build and host a simple, relatively static website. Because the site is static you can easily host it in AWS using CloudFront and an S3 Bucket or on Cloudflare using their Pages. The later is what I’ve done for a new site I’m creating about Programming Project Ideas .

Such static sites are perfect for a simple blog or rarely changing website. No need to run or manage a server and by leveraging the fast infrastructure of AWS, Cloudflare or other cloud providers we can achieve very low latency access - helping with SEO.

You don’t want to see this in your Google Search Console :

And you really don’t want to see any entries in the ‘Poor’ column! Static sites are a great way to ensure you don’t!

But before we get into this week’s coding challenge, some news…

???NEWS! New Live Course! ??

I’m re-launching the Coding Challenges Live series beginning with the Redis edition.

It is a cohort based, live, intensive course that runs for one week. During the week you’ll implement a lite version of a?Redis server. Starting from scratch we’ll work through building a clone of the original Redis server and extend it to support the RESP2 protocol and some additional commands.

This course touches on a wide variety of topics that are applicable to general programming, for example:

?? Parsing skills. These can be applied to a variety of problems including data munging, scraping, protocol implementation and more.

?? Understanding network programming. This can be applied to making more robust, secure and scalable distributed systems.

?? Experience handling concurrency and parallelism in software. Giving you the core skills to build scalable distributed systems.

?? Testing. Network servers are complex system software with components that can interact in non-trivial ways. Figuring out how to test them is a challenge. You’ll explore unit and integration testing.

This course is entirely project focused. The goal of the course is not just to learn how to write a server, but also how to approach the problem of server software. Part of the course involves group discussion about problem decomposition, coding techniques, design tradeoffs, testing, and other related topics. The rest of the time is spent working on individual coding.

You might not think that you're ready to write a server, but if you've been coding for a while and know the basics of data structures, it's something that you can tackle. No prior background in network servers is required although awareness of common programming language concepts (e.g., types, functions, classes, scoping rules, etc.) is strongly advised.

If you are a paid subscriber you can get 30% off - please visit the paid subscriber benefits page for the code. If you are a free subscriber you can get 20% off if you sign up here (code: CCFREE) or you could subscribe now! ??

Ok back to this week’s coding challenge…

The Challenge - Building A Static Site Generator

In this challenge we’re going to build a static site generator. It will allow us to:

1. Create a new site.
2. Add a new page to the site.
3. Define some templates.
4. Run a development server.
5. Build the static site.

Step Zero

In this introductory step you’re going to set your environment up ready to begin developing and testing your solution.

I’ll leave you to setup your editor and programming language of choice. I’d encourage you to pick a tech stack that makes it easy to launch a web server that can then serve the static website during development or the static website. Go and Python both make this very easy, alternatively you could build your own web server .

Step 1

In this step your goal is to allow the user of your static site generator to initialise a project.

Initialising a project should create a new directory for the project and a basic homepage that they can edit. For the moment this home page can be static HTML with some placeholder headings and text.

In other words the user should be able to do something like:

% ccssg mysite
% tree
.
└── mysite
    └── index.html
        

Where ccssg is our static site generator. Do feel free to pick a more cuddly name, like Hugo did ??

Continued...

You can find the rest of this coding challenge on the Coding Challenges Substack .