Wandering Fancy

How to Host Your Volunteer Site for Free

Preamble

The last thing most non-profits and volunteer groups need are needless expenses, and I’ve seen it’s not uncommon for organizations to spend $240 a year on very basic webhosting.

There are plenty of “free” web hosting providers such as Wix, but they generally limit you to a non-customizable domain name for their free tier. In a pinch that’s fine, but most orgs want to have at least some basic branding online, and domain names are generally pretty cheap.

What’s worse in my opinion, is these systems are usually throwing pop-ups left and right trying to sell you upgrades, or showing features that look interesting, but aren’t actually available to you. They pack in a ton of functionalty, but a lot of the features aren’t hugely useful for smaller groups, and they clutter the interface.

On top of that, these tools generally limit you to one login. For many organizations that might not be an issue, but in Scouting we generally have a scout webmaster and an overseeing adult webmaster, and ideally the adult should have a way to review and approve all scout generated changes; trust but verify and all that jazz.

Plus, if you are in a situation where you are training youth on how the web works, tools like Wix are very far removed from the underlying technology, and don’t give scouts exposure to web development fundamentals.

So with all that, here’s my favorite way to run a free website, with multiple user accounts, 10GB of storage, and custom domain support. This method will be a bit more adventurous than something like Wix, but you can do it. A lot of folks say they are non-technical, but really they just haven’t been exposed to these tools, and like anything new, it takes a little practice. You’ve got this.

Ingredients

The key players in this project will be:

  • Hugo - an open source website tool that makes it easy to create content using a simple language called Markdown. There are a number of free themes to choose from, or you can get creative and build your own.
  • Git - an open source tool that tracks versions of files. Website and software developers use Git to track their changes as the work in case they break something, and to keep a history of why they changed what they changed. Git also helps multiple people work together by making it easy to share their changes.
  • GitHub - a service that allows people to share and publish work they’ve done in Git. GitHub provides free web hosting for simple projects, and is perfect for most community organization sites.

There are other places you can host your Hugo based site, but GitHub is very well known, part of Microsoft (so it’s probably not going anywhere), and has a well documented process for making everything work.

I’m going to avoid recreating the wheel and will link to appropriate articles that will guide you through the steps. I will keep this post updated as well as I can on the off chance any of the linked guides go away.

Prep

First up, let’s get our tools.

  • Install Git - We need this to keep track of our file changes, and to send our changes to GitHub
  • Install GitHub Desktop - This will make it easier to connect to GitHub.
  • Install Hugo - I would recommend getting a pre-built version from here
  • Install Sublime Text - To make our website we will be creating text files, and having a nice text editor makes that much more pleasant. Sublime has a very generous trial period, and is great to get started with. I recommend buying a license to support a great small developer, but you can get everything you need to done without paying.

Our mise en place is set; let’s start cooking.

  • Open the command line for your operating system. For macOS this is Terminal, for Windows it will be Git>Bash which came with your Git install for Windows.
  • Follow the steps in this tutorial to create your Hugo based site locally. I recommend the following changes to their steps:
    • Replace ‘quickstart’ with a short version of your site name. In my case, it was “troop3”.

At this stage, you should have a bunch of files on your computer, and when your run hugo server -D and connect to the url it gives you, you should see a site. This is a great time to pause and play with the tool. Try adding another page using hugo new content, edit your pages, and try different elements like bullet lists. The goal of Markdown is that you can create text that looks mostly normal without having to read HTML with angle brackets everywhere. It’s fairly simplistic, but it makes it easy write quickly.

Next up, we’re going to setup Github, push our files to the site, and configure GitHub to build the site everytime we make a change.

Once that is setup, if you have a custom domain name like mycoolgroup.org, you can update your DNS records to point to your new website. Information on configuring DNS can be found here. Note that you should not setup your custom domain if you have content you want to migrate from an existing site first. Get all of your content migrated, and then update your DNS to point at the new GitHub hosted site.

There’s a fair amount of hand waving inbetween those steps, but in bold strokes, following those steps will get you a website that is fast and free, that can be migrated to any number of places easily, or even hosted yourself.

A Fork in the Road

Now if this site was a fresh start for you, you’re ready to rock. However if you have an existing site, it can be a daunting prospect to migrate all of the content by hand. Inevitably your current content is not in markdown format, and you’re looking at a lot of copying and pasting and formatting.

This is where using a large language model(LLM) can be a HUGE timesaver. LLMs like ChatGPT and Claude are built for text manipulation and transformation, and are very comfortable with Markdown and even Hugo. While there isn’t a magic button that will bring everything over, using an LLM can make it relatively painless and won’t cost an arm and a leg; I migrated our troop site for about a buck.

To do this migration we need to give Anthropic or OpenAI access to our computer. The cheapest and most effective tool I’ve found so far is Goose from Block (the folks behind Square.) Goose is a local agent that you can configure with your preferred LLM to handle the logic, constrained to a folder of your choosing.

Let’s dive in! First up we need to get a couple tools setup

Inside of the console you’ll need to add a credit card and create an API key. Once you have the key, add Anthropic as a provider inside of Goose and pick a model; 3.7 latest is a solid bet. Once it’s configured, click in the upper left to select a directory, and point Goose at the folder where you created your site.

At this point, it’s time to ask the LLM to jump in! You’ll want to say something along the lines of:

I am migrating my current website to a new Hugo based website. The 
source for the new Hugo site is in the current directory. Please 
pull the pages from https://yourcurrentsite.org and recreate the 
pages in the Hugo site. Only bring over content from https://yourcurrentsite.org.

These are all of the prompts that I used while migrating our site:

I am migrating a website for my scouting troop from Wordpress 
to Hugo. I would like you to create a new Hugo theme based on 
the website at https://bsa-troop3.org. Please bring over the 
styling and the content for this new hugo based site. Only 
bring over the content of pages hosted at bsa-troop3.org."
You have been doing a great job on this new scout website! 
Please bring the contents of https://bsa-troop3.org/eagles-nest/ 
into content/eagles-nest.md"
On the page eagles-nest.md, please use rowspan to merge 
the rows that have just years in them, and center the 
year in the merged row.
Please update content/eagles-nest.md so that all of the 
date are of the form MMMM DD, YYYY
Please add a 10 pixel left and right margin around the post 
content. The content is right against the edges on smaller devices.
please download the favicon from https://bsa-troop3.org and add 
it to this site
On the discount card page please center the image
Can you please pull header image from https://bsa-troop3.org 
and add it to the Hugo site?
"Thank you for your work on this website so far! Can you please 
move the header image you just added to the left, and constrain 
it to the height of the header?

It might seem odd that I’m saying please and thank you, but there is some research that shows postivity and politeness lead to better outcomes with LLMs, and honestly, I think it’s a bad habit to be impolite since someday you’ll probably want to work with a human again; best to practice the good habits.

Goose will start churning and working through the request. You will likely see it running commands to look at the local files, and then looking at the website you pointed it at. It will most likely download the pages of your existing site into the working directory so it can copy out content. There’s no guarantee that it will get all of the material, but you can look in the live view as it is grinding away to see what has been built. If a particular page is missing you can ask Goose to fetch it after it has finished.

When migrating our troop site, I had Goose bring over the content and recreate the styling we had on our original site as a new custom theme. Goose it quite capable at making Hugo themes, so this can be an interesting exploration and doesn’t cost a lot. All told I think I spent about $2 and idly watched videos while Goose did all the heavy lifting with me pointing out missing pages and styling.

Now, I won’t say that everything above isn’t a lot to dive into, because it is. However, as long as you are willing to dive into a new topic, you can handle this. Hugo has a great community and there are a ton of videos online talking about how to use Hugo, git, and GitHub. The biggest challenge is when something fails siliently which can be very frustrating, but that’s the time to reach out either the Hugo community or a more experienced friend. The cost savings can be substantial and running your site like this sets you up to learn a lot about how the web works. While there is a lot to learn, it’s not nearly as mysterious as it seems.

Please feel free to hit me up with questions on Bluesky or Mastodon, and I’d be happy to make an end to end video if that would be helpful.

Weeknight Easter Dinner

A couple weeks back I got a couple beautiful heads of fennel in our veggie box and went looking for a recipe that put them to good use.

We have to keep our fat intake as low as possible and some folks don’t love garlic, so this is my variant of the recipe. The trick to keeping oil low is to use an olive oil sprayer. Just a couple spritzes is enough to keep food from sticking too much. If the pan dries out, add a little water or broth instead of more oil. Technically you can get away with no oil and just use broth/water, but a bit of oil does help a lot.

The original recipe had a flavorful orzo that could be worth making, but honestly the braised fennel sauce is quite tasty and I’m not sure more than plain orzo is necessary. I also tend toward plain pastas so that folks can dress their own pasta if another part of dinner doesn’t work for them. The orzo does play really well with the sauce, but obviously any pasta can do in a pinch.

Additionally, the original recipe calls for slicing the garlic, but I’ve found keeping the cloves whole lets me infuse a dish with a bit of garlic flavor, without surprising folks with slices of garlic. The cloves are easy to pull out before serving.

The prep time for this one is great; the fennel takes about five minutes to clean, trim, and quarter. The pork tenderloin takes about five minutes to trim, remove the silver, and season. This can all be done in easily under an hour, and some of that time is spent just waiting for things to cook in the oven

I was cooking for four folks, two of whom are big eaters, and aiming to have leftovers for lunches. I doubled the recipe from the original version.

Pork Tenderloin with Fennel and Orzo

  • 2 pork tenderloins (about 2.5 pounds)
  • Kosher salt and freshly ground pepper
  • 1 Tablespoon herbes de Provence
  • 2 teaspoons of olive oil
  • 2 fennel bulbs, trimmed and quartered lengthwise and sliced 1/4 inch thick; fronds finely chopped and set aside separately
  • 1lb of orzo
  • 2 cloves of garlic; peeled and then smashed with the flat of a chef knife
  • 2 cups of chicken or veggie broth
  • 1 lemon

Directions

  • Preheat the oven to 425˚F. Season the pork with salt, pepper, and the herbes de Provence. You want more of all three than you think as the seasonings will be absorbed by the fennel later. Preheat a large ovenproof skillet for 2 or 3 minutes so it is nice and hot. Add 1 teaspoon of olive oil and then immediately add the pork and cook, turning, until browned, 5-7 minutes; remove to a plate.
  • De-glaze the skillet with a bit of broth, then add the fennel and cook until softened and browned, about 2-3 minutes, adding the garlic during the last minute. Add the remaining broth and bring to a simmer.
  • Meanwhile, make orzo as per the package directions.
  • Return the pork to the skillet and transfer to the oven. Roast until the pork is just cooked through, about 145-150º on an instant read thermometer. Remove the pork to a cutting board and return the skillet to the stovetop.
  • Reduce the liquid in the skillet over medium heat until thickened until it is as saucy as you want. I tend to prefer it to be on the juicier side so I cooked it for about 7 more minutes over medium low. Add the lemon juice and then stir until combined; season with salt, pepper, and more lemon if desired.
  • Dish up the orzo, spoon the fennel/broth over it, and then top with sliced pork and fennel fronds.


In addition to this I made a simple lettuce salad. We’ve learned in our low fat journey that oil isn’t strictly necessary to make a decent dressing; really the oil is there to dilute the seasonings and acid, and just a little water can do the same thing. It doesn’t have quite the same body, but if you’re avoiding oil it’s a solid strategy.

The two dressings I made were:

French Vinaigrette

  • 1 clove of garlic, pressed in a garlic press
  • 1 teaspoon herbs de Provence
  • 2 ounces of champagne vinegar
  • A 1/2 teaspoon of kosher salt (Diamond)
  • 1 teaspoon black pepper
  • 1 teaspoon of honey
  • 1oz of water (or to taste); sub in oil if you don’t need it to be low fat

Directions

Whisk and done. Taste the dressing before adding the water to see if you need to make any adjustments; it’s easier to course correct before you dilute it. Sometimes I’ll add a spritz of olive oil to help with dissolving oil based flavors. I have no idea if it helps, but it seems like a good idea.

Honey Lemon Dressing

  • Juice of one Meyer lemon
  • 1/2 teaspoon kosher salt
  • 1 teaspoon black pepper
  • 2 teaspoons of honey
  • 1/2 ounce of water (or to taste);sub in oil if you don’t need it to be low fat

Directions

Whisk and done.

Links

The original recipe from Food Network
https://www.foodnetwork.com/recipes/food-network-kitchen/pan-roasted-pork-and-fennel-14197453

My preferred olive oil sprayer. It’s way less fussy than the ones you have to pump.
https://www.everythingkitchens.com/evo-stainless-steel-oil-sprayer-16-oz.html

The fantastic CSA I got my fennel from. They have wonderful fruit in the spring and summer. Unlike some boxes, you can’t pick what you want, so you have to be willing to take on a wide variety of produce.
https://terrafirmafarm.com

Blackberry Pie in a Glass

If this blog thing continues, a frequent character that will show up here for cocktail posts is Jeffrey Morganthaler. I can’t remember how I first came across his work, but his recipes have been my gotos for years at this point. Despite that I never thought to check his site to look for inspiration for my cassis problem. Thankfully Serious Eats had my back.

The Bourbon Renewal from Morganthaler is pretty basic in the grand scheme of things; it’s a whiskey sour with cassis swapped in for some of the simple. The result is as refreshing as a good whiskey sour, but with jammy, berry notes from the cassis. It’s reminiscent of a New York Sour (a whiskey sour with a red wine float) but the deep berry notes are more my jam than what the red wine brings to a New York Sour.

I prefer it with a couple extra dashes of ango; as written it has one dash, but the Christmas spice flavors give a blackberry pie vibe I like. I also prefer to go a little lighter on the simple syrup. Our tree has Meyer lemons which are naturally sweeter which may be the main reason I reduce the simple, but I tend to like drinks a bit tarter. I’ve also been using some shelf stable, high quality grenadine I have laying around as the sweetener and that has added some additional fruity notes which are nice.

The best thing about this cocktail is it is served over ice. It goes down easy so I’m not sure if watering down will be a problem, but the strong flavors can handle the dilution of sitting around. I build most of my cocktails in a glass and stir them with ice (I’m too lazy to clean my shaker), but not everything lingers on ice well. I can imagine diluting this and carbonating it for a nice summer sipper, but it was also perfectly lovely for a cold winter, evening sipper.

Bourbon Renewal

  • 2oz bourbon
  • 1oz fresh lemon juice
  • .5oz creme de cassis
  • .25oz simple syrup or quality grenadine
  • 1 dash Angostura bitters

Directions

Shake ingredients with ice until cold and strain over fresh ice in a rocks glass. A higher proof bourbon plays well in this drink since it is shaken and then sits on ice for serving.

New York Sour

  • 2oz bourbon
  • 1oz fresh lemon juice
  • 0.5oz simple syrup
  • 1oz fruity red wine

Directions

Shake the first three ingredients and strain into a rocks glass with fresh ice. Pour the red wine over the back of a spoon into the glass to float it. Garnish 1 strip lemon zest expressed over the drink.

Morganthaller’s original post; the Serious Eats post on it has sadly left the Internet
https://jeffreymorgenthaler.com/bourbon-renewal/

New York Sour history
https://www.foodandwine.com/recipes/new-york-sour

Drinkable Alchemy

The first drink I tried in my efforts to explore how to use my excess of crème de cassis was “El Diablo”. At this point I was unsure of how I felt about crème de cassis and the cocktail seemed like a glorified Moscow mule. However, every SEO’d list of cassis cocktails led with it, so I figured it was at least worth an experiment. Worst case the ginger beer would be delicious.

What I love about a cocktail is the right ingredients, balanced in the right proportions, and mixed just right, yields a concoction greater than the sum of its parts. It’s drinkable alchemy.

An El Diablo is one of those drinks. The saltiness of the tequila comes to the front, lifted by the bubbles of the ginger beer. The ginger beer and lime do what they do best, providing a solid midrange of spicy and tart, and then the crème de cassis kicks in with earth, summery berry jam bass notes. I’m generally of the opinion that if you like a mule, then you really just like ginger beer, but this is something bigger and better. It alone makes having a bottle of crème de cassis worthwhile.

This Liquor article is correct that you should use a spicy ginger beer. Fever-Tree worked a treat. I used Espolòn Blanco and it was lovely, but I’m looking forward to trying it with Fortaleza next time I can find a bottle. Many recipes suggest a reposado tequila, and I’ll report back on that experiment when it happens. My suspicion is that I’ll prefer the blanco, but there’s science to be done.

If you take it for a spin, let me know how it goes! I’d love to hear other people’s takes on this one.

El Diablo

  • 1.5oz blanco or reposado tequila
  • 0.75oz fresh lime juice
  • 0.5oz crème de cassis
  • 2 to 3oz ginger beer

Directions

In an ice-filled shaker, shake the tequila, lime juice and crème de cassis untill well chilled. Fill a Collins glass with ice, strain the cocktail into the glass and top with ginger beer. I frequently just build it in a glass and it works just fine if you don’t want to pull out the shaker.

Some recipes call for 0.5oz of lime, but I thought a little extra helped to balance the ginger beer and cassis. There’s definitely room to fiddle with the amount of ginger beer and lime.

A bit of history on the El Diablo
https://www.liquor.com/recipes/el-diablo/

A touch of history on cassis
https://www.nytimes.com/2022/03/11/dining/drinks/creme-de-cassis-cocktails.html?unlocked_article_code=1.304.bCxr.39iaKiL5J3c4&smid=url-share

A solid blanco tequila. If you don’t have a fav, this is a good one to start with https://www.espolontequila.com/en-us/our-tequilas/tequila-blanco/

A House of Glass Bottles

I have the biggest of first world problems; I have too much booze and not enough storage.

My cocktail hobby started off simply enough, with a handful of staples and a number of bottles of good scotch. The situation escalated quickly though. Your average bottle of cordial or liqueur doesn’t tend to tend to be all that expensive, and each bottle unlocks more and more cocktails to try. It’s like a tech tree, in all the best and worst ways. Once you’ve unlocked a new technology, there’s no going back, and thus my bottle collection has become a grow only entity, slowly spreading from cabinet to cabinet. It doesn’t help that once cocktails are your hobby, every holiday comes with a fresh new assortment of lovely libations to experiment with.

Again; first world problems.

For a variety of reasons I’ve decided to fight the good fight and pare down my collection, or at the very least, make sure that every bottle earns its keep and is worthy of its shelf space. To that end, I’ve been working to try every bottle I have, and either find fabulous uses for it and add it to library, enjoy what I have and say goodbye, or pour it down the drain and save my alcohol budget for better spirits.

To that end my current subject of exploration is creme de cassis. This bottle falls afoul of two of the rough rules I’ve created for this project: 1) it’s a bottle I haven’t used in at least a year and 2) I have multiple bottles of it. Having a bottle that never gets used is bad enough, but having two unused bottles is ludicrous.

Crème de cassis is liqueur made from blackcurrants, and is sweet, but has an intense earthy flavor. Comparisons get made to Chambord, but the earthy notes of cassis are like nothing else I’ve tried.

The most famous cocktails with cassis are the Kir and Kir Royal. These are two ingredient cocktails that mix still or bubbly wine with cassis. Both are easy drinking; there’s nothing challenging or particularly interesting about them, but the citrus notes of the wines play nicely with summer berry flavor of the cassis. If you try them, aim for more acidic wines and champagnes to balance the sweetness and avoid oaked wines.

All told these are both worth drinking if you have a good, but overly tart bottle of wine, and I think they are more interesting drinks than the Chambord variants. On their own though, they weren’t good enough to make me think crème de cassis is a must have. That said, there’s more science to be done on this front…

Kir

  • 3oz white wine
  • 0.5oz créme de cassis

Directions

Pour crème de cassis into glass and top with wine. A quick swirl seems to do the trick for mixing.

Kir Royal

  • 3oz champagne
  • 0.5oz Crème de cassis

Directions

Pour crème de cassis into glass and top with champagne. As with the Kir, a quick swirl seems to do the trick for mixing.

Good piece on the history of the cocktails
https://www.diffordsguide.com/encyclopedia/460/cocktails/kir-and-kir-royale-cocktail

My preferred cassis so far
https://maisonferrand.com/en/content/mathilde-liqueur/

A perfect sparkling wine for this cocktail from one of my favorite bubbly makers. Also, Breathless is one of three wineries in Healdsburg with a woman winemaker!
https://www.breathlesswines.com/product/Breathless-Blanc-de-Blanc-750ML