My 2023 website makeover using Astro and Contentful

February 14, 2023

I recently woke up with the urge to redesign my personal website. This time, I wanted a completely static website with a minimalist look, and I decided to use Astro for the job. In this post I'll go over the process and the features that I added.

Introduction

todo

What is Astro?

todo

What was wrong with the old website?

todo

Image processing

todo

Pain points of Astro

todo

Deployment

todo

Time spent

I thought it would take me around 10 hours to finish this project. However, as I ran into some problems and also added more features, the project ended up taking 20 hours. But that's okay, I was not in a rush.

I tracked the time spent using Toggl, you can see the breakdown below. The image features took a big portion of the time, about 5 hours, but I think they were worth it.

Coming up with a design

1 hour

Setting up Astro project

1 hour

Set up frontpage

2 hours

Add image blur effect

1 hour

Mobile styles

0.5 hours

Integrate with Contentful

1 hour

Set up all subpages

2.5 hours

Add slices

2 hours

Fix build problems

1 hour

Write my own image processor

2 hours

Code cleanup

1 hour (?)

Write an OpenGraph image generator

2 hours (?)

Deployment setup

1 hour (?)

Write this article

2 hours

Total

20 hours

Conclusion