This site has been developed using Hugo and I gotta say I LOVE HUGO! A few years back, I made huge call to leave permanent employment and move into contracting. I figured I needed a website, everyone needs a website right? So at the time, I stood up a site on Wordpress, which simply came down to very simple Google Foo on where to put a blog. So Wordpress….
I’m not a fan of Wordpress
I’m no webdev and perhaps much of it is my own inexperience, but venturing into the world of Wordpress was horrid. Content stored in databases, plugins you have to maintain and pray won’t break your site, run a second site to test plugin upgrades, but there’s no true approach for a devops-style development between sites, stability issues, speed issues, clunky design process…honestly, if you run a tidy Wordpress site then I tip my hat to you. But I spent about a year feeling OMG WHAT IS THIS NIGHTMARE!!!
Searching for alternatives
I went searching for an alternative to Worpdress and stumbled upon Hugo.
Here’s their front page. That’s some statement! But I thought I’d give it a try and it hasn’t disappointed. My entire site is managed from within a git repo, I develop content entirely from within VS Code. The majority of my content is written using Markdown, if you are more familiar with coding, git, markdown then feels much more familiar than handling Wordpress. Here’s this post from within VS Code;
It is REALLY fast!
The main advantage with Hugo is that it is a static HTML generator meaning that your content is rendered when the site is built, not being rendered when a user accesses it so the site is incredibly fast to access. You can cater for this using Wordpress as I understand, but ultimately not having to worry about this performance aspect at all is much more preferable.
One of the best features of Hugo for me, is the ablity to render the site locally. Changes are instantly presented when you make them meaning I can make some changes, see how they look on my desktop before pushing them to git to be published….or make some alterations if I’m not happy.
By running the the command;
From the terminal window inside of VS code, I can fire up the web server and view my latest updates locally. In the picture below, you can see the command, followed by a build that takes 239ms and finally a local address where I can see the rendered site. Amazing!
Once the server is running, you can continue to update your files and on saving them, the server will detect the change and refresh the site.
Once I’m done with my changes, I can check them into source control and push them to Github to be published.
The entire user experience is really enjoyable!
I’m going to outline some of the work I’ve done getting this blog started and some of the things I’ve learnt along the way. Here’s is a list of things I’ve worked through and will blog about over the coming weeks;
- Getting a basic site running locally using just Visual Studio Code and then connecting it to Github.
- Hosting on Github.
- Hosting on Azure using Static Web Apps.
- How Github Actions and Static Apps allow for a full test process.
- Using shortcodes to apply repeatable content.
- Redirecting URLs from my old domain through to the correct blog post on my new domain despite structure being different.
- Sharing posts between both sites using git submodules and using shortcodes to manage how the post will behave on each site.
- Configuring social media meta using config in partial templates.
- Using WebDev to improve the efficiency of my site.
I’ll try and post these out on a weekly process.