How I rebuilt my portfolio using Astro and Netlify

It’s that time again, portfolio update time!

I’ve always been one for continually updating my portfolio, I get a bored of it very quickly, but over the past year or two I’ve definitely neglected it. I had fairly big plans for it but, like most things it got pushed back and I never got around to it.

My last major iteration of my portfolio was a Gatsby site that I hooked up to the Dribbble API to pull my latest 6 Dribbble shots. I liked this for a little while but I was essentially just rebuilding my own version of Dribbble. I wanted to do something a bit different this time, I didn’t want to just have a handful of images that showcased my work. I wanted something that was going to be a bit more in depth.

My plan was to have a collection of work that was real, something that I could actaully talk about instead of a made up project. Not that there’s anything wrong with those, they look great on Dribbble but I think that’s where they belong.

A friend told me to try using Astro, I’d not heard of it before but after a quick search I knew it was going to be something that I could get my teeth stuck into.

The process was actually pretty simple, because I’d already been using Gatsby and had a layout that was 90% what I wanted, all I needed to do was run npm create astro@latest and copy and paste a few lines of code. I did have a few issues when it came to my Netlify deploy as Gatsby’s build folder is public however Astro uses dist. That kind of stumped me for a little while as it’s usually one of those things you set and forget, so when my deploy previews were failing it wasn’t clear as to why!

After that it was pretty much plan sailing, the Astro template gives you pretty much everything you need to get something up and running really quick!

Let's chat!

If you’re looking for a design solution for your business or you have a project that you want some design guidance on, drop me a line! I look forward to hearing from you.