Fast static sites for hack-along projects (using Hugo + Github + Netlify)

Nowadays you can have a website hosted for free, with continuous integration, up and running in no time! Follow these steps:

  • Install hugo and create a project following the steps at gohugo.io
  • Select and pull a nice theme from at https://themes.gohugo.io/
  • copy the exampleSite (you can find it the theme’s folder you just downloaded) to the main site directory
  • Modify the config.toml to reflect your content
  • Add the attached netlify.toml configuration file
  • Publish the code to github or gitlab
  • Pull it from Netlify for continuous integration
  • add your custom domain name to netlify (optional)

From now on, any edit to the config.toml pushed to github will be automatically reflected in the published site.

Congrats! you have got a brand new website with continuous integration, and all free of charge!

2 Likes

@liminal

What do you think of replacing Github with Gitlab in this tutorial description? (Just because Gitlab seems to better resonate with the community’s values and is a good group to support)

Great info btw!!

Yeah, this works really smoothly. I’ve been building a few sites this way with the liminalgraph.hackalong.io as the first and currently playing with another one for networked services that I’ll share once Netlified. Speaking of which, you did the last one - how can I generate a subdomain on Hackalong.io to point Netlify at?

Otherwise smooth experience so far :slight_smile:

Gitlab can probably do it as well but the config files for the likes of netlify will be configured for GitHub at a guess so might need rewrite for noobs like me. The CI/CD stuff is cool though, I can iterate in realtime and its updating :slight_smile:

Point taken, just added the option

I’m just trying to netlify a project myself now but am getting the error you mentioned last night, this is something to do with git inside git if I remember correctly:

“failed during stage ‘preparing repo’: Error checking out submodules: fatal: No url found for submodule path ‘themes/meghna-hugo’ in .gitmodules”

Any advice there?

Cheers :slight_smile:

Two possible ways to resolve this:

  1. Make the theme part of your repository: just clone the theme, then run on the directory to remove the theme repository information, then in the theme directory:
    rm -r .git
    cd …
    git add *
    git commit -m"Added theme"
    git push

  2. Using gitsubmodules:
    In your main directory:
    touch .gitsubmodules
    Add the following lines in the file, remembering to change themename and author to the right values for your specific theme.
    [submodule “themes/themename”]
    path = themes/themename
    url = https://github.com/autorr/themename.git

1 Like

Thanks dude, I wen’t with option 2 as it looked simpler but Netlify still fails

To clarify what I’ve done I wnet into the static site repo via terminal and did a touch .gitsubmodules - the result was that terminal just jumped to the next line so assume that went fine.

I then went into the Hugo cargo.toml file within my text editor and added:

[submodule “themes/themename”]
path = themes/meghna-hugo
url = https://github.com/themefisher/meghna-hugo

I then tried:
[submodule “themes/themename”]
path = themes/meghna-hugo
url = https://github.com/themefisher/meghna-hugo.git

No dice.

Then I tried:
[submodule “themes/meghna-hugo”]
path = themes/meghna-hugo
url = https://github.com/themefisher/meghna-hugo.git

Which got Enqued and “build ready to start” - over the fails I guess but still no dice.

So tried:
[submodule “themefisher/meghna-hugo”]
path = themefisher/meghna-hugo
url = https://github.com/themefisher/meghna-hugo.git

But that failed…

Going back to the most successful attempt:
[submodule “themes/meghna-hugo”]
path = themes/meghna-hugo
url = https://github.com/themefisher/meghna-hugo.git

I notice that there is no base directory set under the build & deploy setting page - perhaps thats the key?

Ok, so upon consultation I was doing all that wrong!

Tried: touch .gitsubmodules

Then found the file that was created and added:
[submodule “themes/meghna-hugo”]
path = themes/meghna-hugo
url = https://github.com/themefisher/meghna-hugo.git

This didnt work and contained an error message saying couldn’t find it in .gitmodules so I deleted .gitsubmodules and repeated the same thing with .gitmodules instead. Both deploys failed but the latter attempt went slightly better with an error on the access token

The response code was as follows:
PM: Error fetching branch: https://x-access-token:v1.2d18b87a4ec9d5998d6c1e4a33a87dee89f33a54@github.com/hack-along/lunarpunklabs refs/heads/master :frowning:

Did a search and found this on the Netlify community: https://community.netlify.com/t/error-fetching-branch-after-trying-to-update-submodule/5370

But clearing the cache and redeploying fails also :frowning:

Just wanted to say thanks for this idea, have now deployed it on hugo.guyjames.com and will be transferring it to the root domain when I’ve improved the CSS and removed some unnecessary content.

As a sidenote, I also had the build issue on Netlify, using the Indigo (indieweb-enabled theme), and the submodules approach fixed it. Also there was an issue where the tags had a # symbol in front and it refused to create the pages until I removed that. Luckily Atom has a search and replace for a whole project so that was easy enough.

I agree it is a very nice and rapid way of creating beautiful and fast websites! Thanks again.

1 Like

Also this tutorial was useful for reminding me of the git commands as I hadn’t used it for a while: https://www.netlify.com/blog/2016/09/21/a-step-by-step-guide-victor-hugo-on-netlify/

1 Like

:wave: Hey Guy, good to hear from you! Man, Hugo on Netlify really gave me a hard time but thats probably because I had no clue what I was doing :sweat_smile:… I eventually got the experiment loaded though with some hand holding from @Maija and @liminal’s: LunarpunkLabs.Hackalong.io if you wanna check it out! Nothing too serious there yet - just a first iteration to start gathering intentions/commitments towards something along those lines - which might evolve into an REA network of sorts when the time is right! :crossed_fingers:

I checked your page out as well and I guess we really share some influences! Some really nice poets, artists and bards mentioned amongst them - only name missing for me personally is Mr Robert Fripp and KC :grin: :metal:

Hope you’ll stick around! :slight_smile:

1 Like

hey Josh, yeah it was a serious oversight not putting in KC, in fact one of my favourite bands and I finally got to see them last year in Barcelona, was amazing!

Very nice the lunarpunk site too! :slight_smile: Keep me up to date with developments there please.

1 Like

Even easier than this is this amazing webapp: https://app.stackbit.com/ - I made a Hugo-Netlify site in literally two minutes, and no fiddling with code. Of course I will fiddle with code to add the content and get it looking how I want it, but it’s pretty nice to have the options of various static site generators and several CMS hosts at the touch of a button. Plus it’s free with apparently no plans to ever charge for it.

1 Like