R.T. Hinkel

How I host my website

Dev

Feb 7, 2021


This is a brief overview of how I host my static webpage using HUGO, GitHub, and Netlify.

I use a static website generator called HUGO, which I run locally on my machine. My current HUGO project is uploaded to a private GitHub repository, where Netlify then picks it up, builds the site and hosts it on their CDN.

Using Netlify-CMS, I’m able to create posts, edit existing ones and manage my media library for post content.

Each piece of media is uploaded to a sub directory in the images folder, organized by post title as to not muddle up the image library.

Design Notes

I prefer minimalistic, clean interfaces.

I also have a soft spot for early 90’s/2000’s internet aesthetics. Sue me.

Hosting Overview

%%{init: {'theme': 'base', 'themeVariables': { 'primaryColor': '#f7d1c9', 'primaryBorderColor': '#bd8478', 'edgeLabelBackground':'#ffe8b8', 'tertiaryColor': '#dde1f6', 'tertiaryBorderColor': '#757eaf', 'fontFamily': 'open sans,sans-serif', 'primaryTextColor': '#000000'}}}%% graph TD a\[Local Machine]-. Master .->b\[(Github)] b\[(GitHub)]-->c\[Netlify] c\[Netlify]-->d\[Live Site] d\[Live Site]-.->e\[Netlify-CMS] e\[Netlify-CMS]-. Branch .->b\[(GitHub)]

Essential Services

Extra Functionality

  • Sendowl

    • Digital product sales, donations, billing for services
  • Filepass

    • Project hosting, embedded HQ audio streaming
  • Feather Icons

    • Opensource SVG icons for styling
  • Utterances

    • Opensource comment system
  • JTab

    • Embedding chord charts, guitar tabs
  • Mermaid.js

    • Dynamic flowcharts

https://securityheaders.com test result


Dev, Web, Hugo

Last modified: May 16, 2021



Comments