New Website Built on Astro with Node.js, TypeScript, and Vite

I have a new website! For someone who does this for a living, it’s embarassing to admit but my old website hadn’t had a significant update in almost a decade. It was long overdue.

My website has run WordPress for almost twenty years, but I’ve been doing more back-end development with Node.js, React, Tailwind CSS, and Astro. I chose Astro because I’m trying to learn new technologies and have been really impressed so far. Astro is a modern static site generator that allows me to build fast, SEO-friendly websites with ease. It’s also very flexible and allows me to use my existing skills in Node.js and React to build dynamic components.

My new website started out as a free Astro template, but I’ve customized it to the point that it’s barely recognizable. I’ve added content sections, changed the design and color scheme, and added a few features. I integrated my email newsletter subscription and added form processing for a contact form.

Why Leave WordPress?

I have a long history with WordPress. I’ve developed custom themes, custom plugins, and have even spoken at WordCamp conferences multiple times. WordPress has been a great platform for me for many years, and we still use it for a lot of our client work, but I have been doing more and more custom development and thought my personal website was a great place to test out new technologies.

Benefits of WordPress

• Ease of Use: WordPress is easy to use and has a user-friendly interface. This makes it easy to create and manage content without any coding knowledge.
• Community: WordPress has a huge community of developers and users who share resources, plugins, and themes. This makes it easy to find solutions to common problems and get help when you need it.
• Plugins: WordPress has a vast library of plugins that can add functionality to your site. This makes it easy to customize your site to meet your needs.
• SEO: WordPress has built-in SEO features that can help you rank higher in search engines. This makes it easy to get more traffic to your site.

Downsides of WordPress

• Performance: WordPress can be slow and resource-intensive, especially when dealing with large amounts of content or complex themes. Astro, on the other hand, is a static site generator that generates fast, lightweight HTML files.
• Security: WordPress is a popular target for hackers, and it’s important to keep your site secure. Astro is a simpler platform that’s less likely to be targeted by attackers.
• Flexibility: WordPress is a powerful platform, but it can be difficult to customize and extend. Astro is more flexible and allows me to use my existing skills in Node.js and React to build dynamic components.
• Cost: WordPress hosting can be expensive, especially if you need a lot of storage or bandwidth. Astro is a simpler platform that’s less expensive to host.

Why I Went with Astro

After building a few websites from scratch using Node.js, React and Tailwind CSS, I stumbled onto Astro. I had dabbled in Next.js a while back, but there were some limitations… tradeoffs really… that I didn’t feel worked well for smaller sites like a blog. It’s great for a full-fledged web application, but for a simple blog or personal website, Astro is a better choice. It’s fast, lightweight, and easy to use. I love that Astro doesn’t inject any JavaScript by default, it outputs zero client-side JavaScript out of the box and only adds what is necessary for the functionality added by my components.

Benefits of Astro

• Performance: Astro is a static site generator that generates fast, lightweight HTML files. This makes it easy to get more traffic to your site.
• SEO: Astro is a static site generator that generates fast, lightweight HTML files. This makes it easy to get more traffic to your site.
• Security: Astro is a simpler platform that’s less likely to be targeted by attackers.
• Flexibility: Astro is more flexible and allows me to use my existing skills in Node.js and React to build dynamic components.

Learning Curve

Astro is a relatively new framework, but I found the documentation to be thorough and there are already a lot of tutorials on YouTube. If you’re familiar with Node.js and React, you should be able to pick up Astro quickly.

My Favorite Feature

I love that I can just edit a file and update my website. It reminds me of the OLD days of web development when we would FTP into our server, open the file remotely, and just YOLO it by editing the file and pressing Command-S.

I setup my website on my MacBook Pro and pushed it to a GitHub repository. With a little help from Claude Code, I setup a deploy script that automatically deploys my website to GitHub Pages whenever I push changes to the main branch.

All my blog posts are written in Markdown and stored in a folder called src/content/blog. I use Markdown a lot on my local computer and and prefer it to using a WYSIWYG editor or writing HTML directly.

It’s a little more technical than writing a blog post on a WordPress site, but since no one else uses my website, it doesn’t really matter.

Conclusion

I have been really impressed with Astro’s flexibility and ease of use so far, and have enjoyed jumping back into building websites from the ground up instead of relying on a CMS. Astro could be another tool in our toolbox for building websites that don’t fit into the traditional CMS model.