Skip to content

Colophon

A look behind the curtain into the fundamental makings of taylordrayson.com.

What is a colophon?

...a brief statement containing information about the publication...

How is this site built?

My personal site has been rebuilt many, many times, mainly in WordPress. I think this is version 5 or 6. Where versions 4-6 never actually saw the light of day. With the large amount of data I track, I kept hitting storage limitations and everything was cobbled together with a shoebox and hopes and dreams.

Dependancies

At the crux of it, the site is built with:

I manage all of these via Composer and NPM. Some of the most notable packages I use are:

Hosting

The website is hosted on xCloud , everything auto-deploys and builds on the server when I push to the master branch on Github.

Data & Entry Types

This website is very data-heavy. I track a large range of different information, most of it automated via the IndieWeb PESOS approach. The rest are manually posted from my mini custom CMS.

I currently log the following:

Now Page

The now page is something I've always loved the idea of. It gives people a snapshot of my life right now.

The design was inspired by Apple's iOS widgets.

All the real-time data, such as the current battery, location, time / timezone, weather, and Apple Rings, are all run from an Apple Shortcut that runs every hour in the background on my phone.

API Enrichment

I try to make my life as easy as possible, which is why I try to automate and PESOS as much as possible; for me the easiest path is the one that's going to keep me consistent. If it takes ages to log something, I simply won't track it.

One of the things I use to help me is a bunch of enrichment APIs that make finding an address, a film, a petrol station super simple but also super accurate. Here are some of them:

  • TMDB for film and TV artwork
  • Hardcover for searching books and downloading cover artwork
  • Google Places / Geocoding for searching addresses and reverse geocoding current location
  • PetrolPrices for finding local fuel stations near me
  • LogoStream for airline logos, plus route information between two airports
  • logo.dev for fetching logos for fuel stations such as BP Garage
  • Google Favicons are used in prose for links to external sites.

Design & Features

The design and features are an amalgamation of my old site's design, along with help from my own ideas and opinions, help from LLM's and a bunch inspiration from other websites, some of which include but are not limited to:

People

Companies

AI & LLMs

I use a human in the loop approach to design and development. While I am a web designer as my day job and can still read and write code by hand. For me, I enjoy the process of building things. I have so many ideas that, with the help of LLMs it increases the speed in which I'm able to test and try out new ideas.

I'm still very picky and opinionated about how the code is written, how things are structured and formatted, and I also have high standards with how things look when it comes to work I publish.

I see AI as a tool that gets me from idea to execution with genuine human care and thought behind every feature I build.

1 interaction

01
  1. Taylor Drayson mentioned this in Slash Pages on

Add a comment, or send me the link to your own post.

Link back to this page if you write about it.

This is what shows up when you post the link somewhere.

taylordrayson.com

Colophon

A look behind the curtain into the fundamental makings of taylordrayson.com.

Want to see how it is made? Here is the card on its own, drawn from this page's own title and description.