How I build and host this website

Jesse

2024-07-15 287 words 2 minutes

Contents

Building the Website

Hugo

Hosting the Website

Server (buying the domain, setting up SSL certificate)

Updates

Creating new posts

Hugo automates the creation of new blog content from pre-made templates:

hugo new posts/name-of-post.md

Choice of site theme will determine the templates you start with. I was able to personalize it with a little HTML and CSS knowledge.

My site’s theme is called KeepIt (see the site footer for a link to the homepage). It includes meta options to disable social media sharing, comments, content tags, JavaScript, and mathematical expressions.

Since Hugo can build sites in milliseconds, you can rebuild a local preview of your site on every save. In other words, you get an essentially “live” view of your changes.

Building and zipping the project for upload

PowerShell script

Saved as a .ps1 file in the project’s root folder.

# Update source control
git pull

# Build static site
hugo

# Delete old zip
Set-Location .\public
Remove-Item .\jtrm.zip

# Create new zip
Compress-Archive .\* .\jtrm.zip

# Prepare for upload to server
Start .
Start "https://www.hostgator.com/my-account/login"

# Return to top level
Set-Location ..
exit

Explanation of the script

Start is an alias for the Start-Process PowerShell command.

If you pass a local directory path, Windows Explorer opens to that location.
If you pass a URL, it will try to open that URL in your default browser. (If you’ve ever tried entering a URL in the address bar of Windows File Explorer, the same thing will happen).

So start . opens a Windows File Explorer window in the current folder (.\[site-root]\public), which will make it easy to drag-and-drop the zip into the server’s file manager.

The second `Start`` command opens Chrome to the login screen of my hosting provider.