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:
Chart.js for activites and stats pages
Hugeicons Pro for all the icons
Tiptap editor for manual posting
MapLibre for maps and
OpenFreeMap for the tileset. I use
Mapbox for generating static maps on the timeline view
Twemoji for rendering emojis as images
highlight.js for code syntax highlighting and
Plyr for video embeds
Inertia.js for connecting Laravel and Vue, plus SSR so I can use microformats- A bunch of
Spatie packages:
spatie/browsershot for generating dynamic open graph images
spatie/laravel-backup for backing up the
SQLite database every 12 hours and syncing new assets once a day to Cloudflare R2
spatie/laravel-medialibrary for managing all the different asset types connected to entries
spatie/laravel-feed for creating the different feeds
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:
- Activities syncs from
Strava every 5 minutes - Sleep syncs from
Health Auto Export every 12 hours - Food syncs from
Rovi every 15 minutes - Media syncs from
Trakt every 10 minutes - Events
- Appearances
- This Week With syncs from
This Week With once a day - Flights
- Places syncs from
Swarm (Foursquare) every 10 minutes - Fuel
- Projects
- Articles
- Notes
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

mentioned this in Slash Pages on
Add a comment, or send me the link to your own post.
Send me the link and your response will show up on this page.
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.