This site was very much “built,” and the source code can be seen here. The various platforms involved:

  • Google Docs—all of the words on this site are in a Google Doc with a pretty simple structure and a diligent use of Heading 1 and Heading 2 styles. If we edit the Google Doc, the site will automatically update with the changes overnight (sure, it could uptake changes faster, but…why?)

  • SmugMug—all of the photos are hosted on SmugMug and pulled in via the SmugMug API, so we can adjust what photos are included, as well as tweak the photos/captions/tags within SmugMug and they will automatically be reflected on the site

  • Apple Health—Benton’s Apple Watch collected step and distance data (and other data, but those are the main ones we used), so we did an export from his phone and included that data on the site (it’s at the bottom of each post)

  • Fitbit—because Tim is generally more low-rent than Benton…he has a Fitbit rather than an Apple Watch, so we pulled in steps and sleep data from that (interestingly, the Fitbit died mid-trip and had to be replaced, which resulted in 3 days of incomplete data; Tim did a little linear regression to build a model based on his Apple Health data to impute the data for those three days)

  • Swarm/Foursquare—Tim has long been in the habit of “checking in” to places, and he continued to do this throughout the trip, so we pulled data from that platform to feed the “places we explicitly checked in” list/map at the bottom of each post

  • Python—that’s the core of the custom code that is pulling from the above two sources

  • Hugo—the static site generator that is used to actually build the site

  • JavaScript—of course

  • Netlify—the site is hosted on Netlify, and rebuilds periodically, running a script to generate static html, which is then served here!

In order, what happens on each build is:

  • A Python script pulls text and formatting from a Google doc using Google’s API, which contains all of the text content on this site, and the script also makes a call to SmugMug’s API in order to grab photo metadata.

  • The Python script also reads in saved data from Swarm (for locations), Fitbit, and Apple Watch dumps (it doesn’t query on every build).

  • After pulling in this data, the Python script creates markdown content files in an organized structure, with YAML metadata at the top.

  • The content files are then processed by running Hugo, which is a tool that generates static HTML by using the content files from the previous step with HTML templates.

  • The base templates come from the PaperMod theme, but many of the templates were modified to add some of the following features:

  • At the top of each page, a random image from that day is shown (the image changes on load).

  • All the images on a page are shown in a gallery that can be clicked on using a lightbox.

  • OpenStreetMaps combined with Leaflet to display Swarm checkins on a map for a given day.

  • Better search functionality (previews are shown when searching for a specific word on the search page)

  • Basic statistics for each given day using the FitBit/Apple watch data.