`s/build your own website/build your own static site generator/`

This will (hopefully) be my final webshitter project. I initially wanted it to be a blog unrelated to 0x19 but I decided against this. Instead, I will publish sources under 0x19. Instead of making more webshit, I want to start making something actually interesting and actually useful.

The purpose of this article is to demonstrate how easy it can be to build your own static site generator. You only need a few components:

• scripting language
• markdown to html library or a standalone markdown processor
• css

For the purposes of this article, my ssg is written in shell.

The process of building one yourself

1. verify that the markdown processor works
2. copy the directory hierarchy from the dev dir to the prod dir
3. copy non markdown files
4. create extra pages using markdown or xml
   • blog index
   • sitemap
   • rss feeds
   • source code display page
5. convert all markdown files to html and copy them

After the core of the website is complete, you can add things that are useful to have

• script to add todolist items
• script to make new blog posts
• script to add a random mascot (Lain) every time the site is generated
• a makefile to make it easier to use
• edit the pandoc template to make it look nicer
• add some javascript to filter the people who try to view your site with javascript enabled

If you want to use mine

Grab the code https://gitlab.com/binrc/sh-ssg. Remove the sample blog posts, todo items. Edit the index page.

The shell scripts have been thoroughly commented and are intended to be extensible. Some amount of spaghetti was required to accommodate GNU systems.

CSS

All the css is stored in dev/assets. The general.css is responsible for the Lain watermarks, the style.css is everything else.

Pandoc is a bit strange, the syntax highlighting theme is based on gruvbox and is a json file at dev/assets/gruvbox-pandoc.theme.

HTML

The pandoc template is at dev/assets/pandoc.tpl. You could easily replace pandoc with any other markdown processor.

JS

filter.js can be removed. It is included for a bit of trolling.

BACKEND

Everything is a shell script tied together with a makefile. OpenBSD/Linux are the only systems I use so they are all I cared to test against.

conf.sh - the general configuration file for all scripts, sets env vars and does OS detection
gen-rss.sh  - generates both a plaintext and html rss feed (comment either out if you don't want/need them)
main.sh - calls various scripts in order 
new.sh - makes a new blog post
random-lain.sh - adds watermarks to every HTML file
todo.sh - make new todo item
render.sh - does everything not listed above

The makefile has a few options:

make -> build the whole thing
make new -> new blog post
make editlast -> edit last blog post
make todo -> new todo list item
make lint -> run the scripts through shellcheck
make serve -> run php test server on port 6900
make stop -> stop the php test server

Additionally, there are two directories. The dev directory is for pre-rendered files. The prod directory is for rendered files. No code to sync with a server has been included.

Licensed as BSD-2 so do whatever the hell you want. Let me know if you are using this and get stuck. I'm glad to help.