Creating this website

Getting started

I’ve been contemplating the idea of creating a website for sometime, but my initial (mostly half-hearted) attempts ran into some serious technological glitches. I started out trying to create a GitHub site using Jekyll, since I knew I wanted my website to be hosted via GitHub to keep all of my code in the same place. After about an hour of unsuccessful commits that resulted in a lovely white page with my name on it, I scrapped the whole venture until I heard about the blogdown R package. Since R is my programming language of choice, the idea of being able to write posts in RMarkdown and preview my site from the comfort of RStudio was tremendously appealing. I saw a research site created through Hugo’s Academic theme using blogdown that referenced some helpful tutorials and decided to give the process another shot.

Hugo + blogdown

After my initial failures with Jekyll, I knew enough about the process (and my own skills) to be wary of the Academic theme’s optimistic tagline “Create a beautifully simple site in under 10 minutes”. So fair warning: getting this site up and semi-running was the work of an afternoon plus. I am not going to provide a full tutorial here, since several excellent ones already exist, but I will give my input on which resources worked for me and where I had difficulties.

Useful resources

I started out following Amber Thomas’s instructions for using blogdown, Hugo, and GitHub pages to create a website. I probably should have taken better note of her initial disclaimer that simpler methods of creating a site exist, but nonetheless I found her instructions useful for wrapping my head around the method behind the whole process. As she explains, GitHub pages and Hugo work in different ways: GitHub pages uses information from the master branch of the repository to build your website, while Hugo builds a website inside the public folder. The solution she presents in her tutorial creates a sub branch within GitHub. She provides some shell scripts written by Jente Hidskes that create the sub branch and also update the site. These did not run for me for whatever reason – I believe Hidskes has written an updated tutorial to fix them, however.

While I was reading the comments on Thomas’s tutorials to try to troubleshoot the shell script problems, I found a different tutorial by Robert McDonnell that promised a more streamlined approach. McDonnell gets around the GitHub/Hugo conflicts by creating two GitHub repositories, one for the website (for example, my repo is called babichmorrowc.github.io) and one for all of the Hugo and blogdown content (mine is called website-hugo).

To link these two repositories, Thomas has users create a Git Submodule using the following code:

git submodule add -b master git@github.com:<username>/<username>.github.io.git public

This is where, once again, I ran into difficulties. I kept getting the error:

Cloning into '<filepath>/website-hugo/public'...
git@github.com: Permission denied (publickey).
fatal: Could not read from remote repository.

Please make sure you have the correct access rights
and the repository exists.
fatal: clone of 'git@github.com:babichmorrowc/babichmorrowc.github.io.git' into submodule path '<filepath>/website-hugo/public' failed

Fortunately, there turned out to be an easy fix for this – the code McDonnell provides uses the SSH URL, which is something I do not have set up. I replaced it with the HTTPS URL (code below), and went on my merry way.

git submodule add -b master https://github.com/babichmorrowc/babichmorrowc.github.io.git public

Pushing to GitHub

From that point forward, I had a functioning site that I could preview in RStudio using the serve_site() function. Using the following Git commands, I could push those changes and get that same site up and running online:

# From the folder for the repo website-hugo
cd public
git add .
git commit -m "new commit!"
git push origin master

cd ..
git add .
git commit -m "new commit part 2"
git push

Editing my site

I’m still learning my way around the format of the Hugo site, but by some trial and error I’ve started the process of customizing the site. I am using the Academic theme. So far I’ve managed to update my bio, add a publication, and take a stab at creating projects. As I get more familiarity with the format, I will try for a more comprehensive blog post explaining how to add your own content.

Avatar
Cecina Babich Morrow
Data Scientist

My research interests range from harnessing data to improve mental healthcare to understanding global patterns of macroecology.

comments powered by Disqus