How the hell does this work

An interesting overview of how this site works.

High level

  1. Write content using the language of angles
  2. Convert content to HTML (the language of Satan)
  3. Save converted content into Amazon's Simple Storage Service a.k.a S3
    1. Press the "host as static website button"

Low Level

Writing content in Markdown

This part is really easy. Just write whatever you want, and use markdown to add things like headers, lists or images.

You want fancy HTML things like floating flex divs? To bad, you can't.

These things are for making flashy blogspam. If you want flashy blogspam then markdown isn't for you.

An interactive Markdown tutorial

Convert to HTML

I used the javascript library showdown to convert.

Note: This library is not currently maintained, it appears lone maintainer is currently doing front-line COVID stuff. So don't expect patches and don't expect your PR to get reviewed. This is the risk of doing business with npm libraries.

I added a small extension to load CSS files as well.

Put into S3

  1. Get an AWS account
  2. Navigate to S3 using their world class user friendly interface
  3. Create a bucket named the same as your desired URL
  4. Upload all your stuff
  5. Check the host static website button

Automate or die

A quick script for doing the previous three steps

#!/bin/bash

mkdir -p html

for f in *.md
do
  echo "Processing $f file..."

  showdown makehtml --parseImgDimension -i $f -o html/$f -e $(pwd)/showdown-add-styles.js
  mv -- "html/$f" "html/$(basename -- "html/$f" .md).html"
done

aws s3 cp ./html/ s3://www.parrisvarney.com/ --acl public-read --recursive
aws s3 cp ./img/ s3://www.parrisvarney.com/img/ --acl public-read --recursive
aws s3 cp ./css/ s3://www.parrisvarney.com/css/ --acl public-read --recursive

Making it harder

The obvious first step into a world of ugly complexity is adding a "fast" flag that skips the file uploads. The devil is waiting. Here is your new script.

#!/bin/bash

FAST=false

while [[ $# -gt 0 ]]
do
case "$1" in
    -f|--fast)
        FAST=true
        shift
    ;;
esac
done

mkdir -p html

for f in *.md
do
    echo "Processing $f file..."

    showdown makehtml --parseImgDimension -i $f -o html/$f -e $(pwd)/showdown-add-styles.js
    mv -- "html/$f" "html/$(basename -- "html/$f" .md).html"
done

echo "Uploading html..."
aws --profile parris-home s3 cp ./html/ s3://www.parrisvarney.com/ --acl public-read --recursive

if [[ "${FAST}" = false ]] ; then
    echo "Uploading images and styles..."
    aws --profile parris-home s3 cp ./img/ s3://www.parrisvarney.com/img/ --acl public-read --recursive
    aws --profile parris-home s3 cp ./css/ s3://www.parrisvarney.com/css/ --acl public-read --recursive
fi