Hello.World.

I wasn’t going to do a “Hello World” post, I was going to painstakingly try to think of a title that made me seem far wittier than I actually am.

There are two reasons why I didn’t.
1. I’d probably delay launching the site until this post was done.
2. Out of the blue I found myself thinking about the clip in The Simpsons where Christopher Walken is reading “Goodnight Moon”.

I now hope you have said “Hello. World”. in a very Christopher Walken manner out loud. At the very least in your head, if not out loud while thinking no one was around.

The Why

I seem to iterate on my personal site multiple times a year, always wanting a blog and never putting one on there. This time I was determined to do so.
Rebuilding your own site gives you some freedoms that you don’t often get working with already established products/websites. It allows you to play with new features like the popover API and anchor positioning. It allows yo to play with shiny new frameworks (or ditch some dependencies that are no longer really needed).

The Tech Stack

Astro w/ no frameworks for the js + CSS

Astro

I’ve been banging on astro to anyone who will listen for the best part of a year now. I absolutely love it. Out of the box it gives you a great dev experience and a super fast front end, and is capable of doing most things that next/remix/whatever other js framework might be.

I wanted a blog but I didn’t want a cms. With recent releases Astro has rolled out a content layer with custom loaders. One of these prebuilt custom loaders was for notion, a platform I use pretty much daily. After combing through the repo and prodding copilot with questions I was up and running within 10 minutes.

CSS

I touched on this above, over the last couple of years, CSS has come along in leaps and bounds. I attribute a lot of this to the death of Internet Explorer. So I have decided to dive into this with using plain old CSS, no preprocessor or even no library. This site isn’t going to be super huge so I don’t need a massive collection of utilities. A basic reset, some settings living in vars and I’m good to go.

JavaScript

I do enjoy react, it definitely has its uses but using it in Astro for what is essentially just a blog, was overkill. The good thing about Astro is that at a later date if I want to use React, (or angular, vue, others) I can just build a component using it and insert it. Wild right?

The Design

Lately I’ve really been digging narrow, minimal UI’s. This was helpful as I had set an arbitrary deadline of a few days whenever I had spare time to have this site up and running. As for the header it’s an idea that I’ve wanted to roll with for years but could never find the right design to put it on.

The Features

• Notion as a CMS: all blog posts pulled from notion so I did not have to add another platform to remember to log into
• Font Settings. The blog pages have a font setting which allows you to toggle between a few fonts. Fast Font, based on bionic fonts which is designed to make reading easier for people with ADHD (it seems to allow faster reading for most people though). Open Dyslexic: Afont designed to make reading easier for people with dyslexia and Atkinson Hyperlegible (the default font for this site): A font designed to be easily readable and aesthetically pleasing for all people including those with vision impairments.

The SEO

Currently I am only using a privacy first analytics platform named Goat Counter. At a later date I intend to add structured data and a heap of the other fancy stuff google froths over as an experiment to see if adding these things can help anyone improve, or if it is just a bonus for people already in contention for top spot.

What’s Coming next

In no particular order.

• tidy up the styles of the blog. As I post more I’m sure notion will show me some weird markup I will inevitably hate the look of.
• light/dark mode toggle. It’s functionally ready to go but the design is not.
• hopefully more blog posts. Although they wont be all about development or tech, Some might be sharing a photo I’m particularly proud of, talking about various sports, talking about music and the music industry. It’s my little slice of the internet and I’ll do what I want with it.
• I intend to experiment with Astro’s content collections and see what else I can pull in. Maybe a store managed entirely through stripe among other things.
• Searchable blogs/tags
• a non boring 404 page
• RSS feed
• Auto generated og images
• further improve the header design. It’s not inline with the vision I originally had BUT as we keep telling the SheCodes cohorts. Done is better than perfect.
• Rejig footer design.