RecentlyOdds & Ends
now playing

About this site

Last site update: 14 Jun 2026 3:27 AM PDT

Why it’s made

I want a place on the Internet that is my own, where I can share what I make, what I do, and what is important to me with the world. Here it is!

Across this site, I try to balance professionalism and personalization. Lately I’ve also been valuing digital minimalism, which is reflected in the simple site design.

How it’s made

This site is powered by Hugo, a static site generator, and uses a custom theme. The source code for the theme is private for now because frankly it is a mess, though I am slowly refactoring and cleaning it up as I go to one day make it public.

Github CI deploys it to two domains on each commit: garado.dev (Github Pages) and garado.neocities.org.

Hike maps

  • Tech stack: Leaflet for interactive maps, leaflet-gpx for displaying routes, and CartoDB for the tiles.
  • Data source: When I’m out, I use a GPS logging app to record my route in a GPX file. I manually clean up the resulting GPX using gpxstudio to keep the map views tidy.
  • Photo locations: The pictures I take don’t have location metadata attached, so a preprocessing script cross-references the time the photo was taken with the coordinates/timestamps in the GPX file to extrapolate the position at which the picture was taken. The photo’s EXIF data is updated with those coordinates.

Park completion

  • Tech stack: Leaflet for interactive maps, and CartoDB for the tiles.
  • Data source: The East Bay Regional Park District kindly offers GIS data for all of their parks, including park boundaries and trail routes. I touch up the trail routes manually in gpxstudio before using them. I use Overpass Turbo and OpenStreetMap for non-EBRPD areas.
  • Process: I have a Python script to split the trail data into smaller segments, creating a reference file to compare against. I run another script to scan my relevant GPX data, union them with the segments in the reference file, and from there mark segments as visited/not visited.

Wiki

  • Data source: For taking notes, I use Silverbullet, a browser-based markdown editor. These notes are stored on my home server.
  • Process: For populating this site with those notes, I have an insanely complicated Python script that I run manually which copies select notes from the server, then does a lot of annoying formatting conversions to get the Silverbullet-formatted note to render nicely with Hugo. The script supports plugins I use as well: Excalidraw, geonotes.

Credit to Sam Griesemer for influencing the layout of the wiki pages - an example of his is here. I think his is a pretty flawless design.

Webgraph

I write the webgraph content in a YAML file, which Hugo inserts into the page as inline Javascript. A separate piece of JS reads that and builds the graph from there. The graph implementation itself uses no external dependencies.

Life clock

Clock face made with SVG. JS updates the time at page load based on my birthday. It uses my personal life expectancy (87 years).

Junk Drawer

Idea from Brandon Stone, whose implementation looks way better than mine :P

Odds & Ends

Idea from eluisa. Images drawn in Krita on Surface Go 2. Sound effects: Pixabay, Minecraft Sound Database, and Freesound.


Site inspirations