Life in Weeks This is an interactive map of my life, where each week I've been alive is a little box. The box's border color represents where I was living, the fill color what I was doing. Tap a box to see what I was doing where that week. I made this to help myself see the bigger picture of the road I've walked. Read more about Life in Weeks at Wait But Why. This code was copied and adapted from Buster Benson. It is a single webpage statically-rendered with Hugo hosted on Netlify. It consists of two data files, an introduction, and a template. π Setup Install Hugo: brew install hugo # Mac Clone and run locally: git clone https://github.com/ginatrapani/life-in-weeks.git cd life-in-weeks hugo server -D Visit http://localhost:1313/. β¨ Customize content/ β Page content layouts/ β Templates assets/scss/ β Styles assets/imgs/ β Site-wide images static/ β Unprocessed assets hugo.toml β Site settings Colophon This page uses Bootstrap for layout and interaction, and a smidge of jQuery to reflect the current week on the map. The font is Red Hat Display. Colors chosen via Color Hunt. Edited in Zed. More Life in Weeks There are several neat Life in Weeks examples and tools, including: Weeksofyour.life: Make your own, completely browser-based Life Calendar: Make your own, with multiple layers My Life in Days: Beautiful refactor, by days π― βI always get to where I am going by walking away from where I have been.β β Winnie the Pooh