Why Astro?

So before I get into my experience using Astro and Tailwind to make this project, I wanted to talk about why I chose Astro.

1. I would say the first reason is probably that I wanted to have a blog attached to the website. Claude had told me that Astro would be a great tool to do the job, but didn’t really tell me why. Then I did some of my own research and I found content collections as being the reason why. Content collections are just groups of structurally identical data that can be grouped and displayed together very easily. I ended up using them for both the blog and the learning materials I attached to the ‘Learning Materials’ section of the website. I thought about using Quarto in order to help render my markdown blogs to html, however once I started to understand the full scope of Astro it became clear that it was the right tool for the job.

2. The second reason I didn’t initially anticipate, but was very glad to have stumbled upon. Astro’s out of the box development tools and set up were fantastic. At first I was very confused about all the stuff that seemed to be thrown at me. For example I would shocked to see the 86 node packages installed from the outset of installing the project! I got even more confused when I realized all 86 of those packages were devloper dependencies. I began to appreciate all the strings attached as I developed the website and didn’t end up needing to install much else compared to my starting point. So really it felt like Astro shipped with most everything I needed which was very nice.

3. The third and most important reason is that I can write my blog posts in markdown and render them to html to begin with. I take all my notes with markdown and I find that it’s often the right tool for the job.

My Experience making this website

As I say on the front page of the website, I don’t really make websites so this was something new for me. I had made a simple CRUD app in my Junior year of college, but didn’t really understand making websites or web apps very well at that time. This experience was much better than that CRUD app experience I had in the past and helped me seperate the two different tasks of making a website and connecting it to a database. Sometimes it feels that we try to move so fast in school that we forget about the basics and don’t build up that solid foundation. This helped me get some ground underneath me.

Now I want to go into the different parts

Setting up the tools on my Computer

This was probably the most confusing part of my whole experience so I tried to make sure I logged all my steps in my notes. So many different things are abstracted away from me with Astro which is nice, however I often feel the need to understand every step of a process before I can move on to the next thing. The actual set up didn’t take that much time, but I kept looking things up I didn’t understand to try to get a good grasp of what was happening, which made this first step of the project take signifcantly longer. Once I began to better understand was npm was capable of, I better understood my context though.

Starting from the base

So when I started creating the website I decided I wanted a starter base in order to see what was going on before I started building the actual website. I think this may have been more confusing than starting from nothing though. The structured project start helped a bit once I understood it, and probably ended up leading me in the right direction, but I had a lot of questions like: what the hell are components or what the hell are layouts. I eventually began to understand my project as the pieces put together to make the entire thing along the way though.

Building up the website

I used opus 4.7 extra high in order to help me on my journey here. I thought it would be a good balance between tokens and understanding of my subject area. I was actually presently surprised with my building experience with claude this time though. Normally when building with AI after the project I feel like I have this depression about the project because I feel like I didn’t learn all that I could. Without the pressure of a deadline though I think most of this stress and the feeling that I needed to ship something faster all went away. Instead I was able to focus on understanding the things I wanted to and even when Claude took 5-10 minutes to respond I didn’t feel the need to just immiediatley jump to my phone. There were things in the site I wanted to work on I didn’t need Claude’s help with so it truly did feel like a co-work experience which I think may be rare.

I will say that Claude was really bad with using cli tools to try to verify it’s own work though. Often I would just stop it because it would fail during tool use. This was fine though because I didn’t really need it to do that to begin with, I can check the work myself.

Takeaways

What this taught me about other projects

I think one of the biggest takeaways for me was understanding how much more active web dev is compared to many other fields in computer science or software engineering. The tools made it so easy to make the website AND very enjoyable as well. I understand why people like doing web development.

It also helped me get some new perspective with other computer science related fields though. It’s not that these fields are hard or obscure, it’s just that not as many people are as interested in doing them or understand why they should. With web dev building produces a real output that you can look at and interact with. Also you can make a pretty big splash with minimal code due to the fact that there are so many tools to help you out! Other fields don’t have as many tools or interest so it may take longer to do/understand something. That isn’t to say they are bad, just not as looked at.

Things I had the most fun with

I really enjoyed making the themes for the different blogs. I like the idea that you can make a layout for one of the markdown files to make them look a certain way. I think this is a fun way to add some character to each different blog post, trying to create the right environment for a user to read them in.

Also I really loved designing the site! I think it look pretty good right now and feels almost exactly how I envisioned it which is great. There are a few things I still will probably add in the future, like some sort of find feature for the blog posts. Also I think I’ll probably add a a projects page for projects that I have done that I’m not the repo owner of or maybe the finished product is more availabe on a platform that’s not one of the ones linked in my socials. There’s room to grow and I think I’ll probably think of more things as I continue to develop the site and add content.

The last thing that was really awesome was using Neovim for this project. I have seen the The Primeagen using Neovim for a long time and I finally wanted to dip my toes in. I am loving it! I thought it may be the wrong tool for the job since I’m using a fair amount of AI alongside my own work, boy was I wrong though. If anything it felt like a better AI integrated experience than anything I’ve used in the past, and I don’t even have any LLM plugins! I can’t wait to keep exploring Neovim :)