My First Blog Post: Exploring Astro

Welcome to my first blog post on this new site! I've decided to build this portfolio using Astro, and so far, the experience has been incredibly smooth - I say so far but that's mainly been the setup - which was a breeze.

There are many ways to spin this up but I chose to clone the Astro repo with-tailwindcss locally;

npm create astro@latest -- --template with-tailwindcss

Follow the step by step wizard, change to the directory and spin it up. The dependencies are already installed by the wizard;

cd [directory-name] && npm run dev

Easy peesy - then the customisation begins.

Why Astro?

Astro's "islands architecture" is what really sold me. Being able to deliver zero JavaScript by default while still using my favorite UI components is a game changer for performance.

"Speed is a feature, and Astro delivers it by default."

Plus staying current with all the javascript frameworks and now AI processes can be daunting. The flexibility is there to use whatever we choose or just keep things simple.

What's next

There is better documentation out there than mine on how to start into Astro but I will document anything I think is of interest to me and maybe to you.

I plan to use this as a bit of a devlog, recording when I feel it's of relevance and a project/idea showcase - for anything and any ideas that make it past the jotting down stage.

Short, sweet and uninteresting for now but that'll do.

Welcome to my first blog post on this new site. I have been putting off rebuilding my portfolio for longer than I would like to admit, partly because the modern frontend ecosystem can make a simple content site feel like a much bigger project than it needs to be.

I wanted something fast, flexible, and still pleasant to work on. Astro felt like a good fit because it lets the content stay mostly static while leaving room for interactive pieces when I actually need them.

Getting started

I started with the Astro Tailwind template:

npm create astro@latest -- --template with-tailwindcss

The setup wizard handled the initial decisions, and once the dependencies were in place I could run the site locally with:

cd [directory-name] && npm run dev

That part was genuinely easy. The harder part, as usual, was the customisation afterwards: deciding what belonged on the site, how to structure it, and how much of the design should be shared between things that are not really the same kind of content.

Why Astro?

Astro's islands architecture was the main reason I chose it. I like that a page can ship as HTML and CSS by default, then add JavaScript only where an interaction earns its place. For a site that is mostly notes, project logs, and experiments, that feels like a sensible starting point.

I also like not being locked into one frontend framework. I can keep the site simple when simple is enough, and still bring in a more interactive component when a project needs one.

What this site is for

There is better documentation out there for learning Astro than anything I am going to write here. That is not really the point of this blog anyway.

I want this to be a devlog and a place to show work that gets past the early idea stage. That might mean a frontend experiment, a game prototype, a physical build, or something that is still a little difficult to categorise.

The original version of this note was deliberately short. This edited version adds context, but the short version is still the one that best captures where I was when I started. That distinction is useful to keep around.

What is next

The next step is to keep using the site rather than endlessly preparing it. I want to document the decisions that seem worth remembering, including the bits that do not work first time.