From the moment I first encountered Astro, it gave me good vibes. Its name and logo caught my attention, but I knew that wasn't enough to judge a technology. However, something told me it had great potential.

🌌 Why Astro?

Astro came to fill a gap in the vast world of JavaScript frameworks. When considering which technology to use for creating a static application with a modern development experience, the first options that come to mind are Next.js, Nuxt.js, SvelteKit, or Gatsby. However, all of these options rely on sending JavaScript to the client, even when dealing with a static website. This is because they work as metaframeworks built on top of other technologies:

Next.js and Gatsby → Depend on React.js.
Nuxt.js → Depends on Vue.js.
SvelteKit → Depends on Svelte.

🚀 The difference with Astro

This is where Astro stands out: its rendering is based on HTML, CSS, and pure JavaScript, without the need for an additional framework. Additionally, its Islands Architecture allows for the intelligent integration of other frameworks like React, Vue, Svelte, Preact, SolidJS, or Alpine.js, making it easy to add interactivity without compromising performance.

🔬 First tests with Astro

Since its release, I felt the need to try it (Yes, the need, something deep inside me was craving to use Astro), but time wasn’t on my side. My first attempt was to migrate my current girlfriend's blog from Next.js to Astro. In that first test, I kept the same UI with TailwindCSS and the CMS with DatoCMS, but without exploring many of Astro’s features. You can see the result here: 🍂 nuestrashojasamarillas.com.

It wasn’t until I had more free time (due to an unexpected twist in my work life) that I decided to fully dive into Astro and develop my own website from scratch. As a developer, I couldn’t resist the temptation to rebuild my portfolio with the latest technology that excited me. This time, I wanted to take advantage of all of Astro's capabilities.

🎯 Challenges and learnings

One of the most interesting challenges was developing everything with HTML, CSS, and pure JavaScript, without UI libraries or predefined components. I used TailwindCSS for layout and Zod for form validation, but nothing else. It felt like the old days, when building from scratch was the norm, and every line of code had a clear purpose.

🔥 Key features I explored

✅ Internationalization (i18n) Routing to offer my site in two languages (es and en).
✅ CContent collections to efficiently manage the blog content.

🌟 What I liked most about Astro

💡 The File-based routing, which is very popular now. Almost all modern frameworks use it. It’s very convenient and makes the job easier without additional configuration.
💡 Native integration with Markdown and MDX.
💡 .astro Components: Simple, powerful, and easy to understand.
💡 Template Directives, which add an extra layer of power to your components. It allows you to keep everything as native as possible, but also opens the door to give your HTML "superpowers".
💡 Support for multiple UI frameworks like React.js, Vue.js, Svelte, Preact, SolidJS, or Alpine.js.
💡 Deployment adapters for Cloudflare, Netlify, Node.js, and Vercel.
💡 Support for Internationalization (i18n) without external packages.
💡 Content Collections for managing structured content.
💡 Local and global styles with <style> inside components.
💡 Integration with View Transitions API.
💡 Component Script in Astro, any code placed within the --- --- delimiters at the beginning of a file runs on the server, enabling backend logic execution without additional configuration.
💡 API Routes, provides the ability to create API routes using methods like GET, POST, and more. This enables extending the application's functionality, making it adaptable to specific needs without relying on an external backend.

🔮 Final Reflection

Astro has been one of the most impressive technologies I've encountered in recent years. Not only does it offer excellent performance, but it also provides a developer-friendly and flexible experience. Is it worth trying? Definitely yes.

If you're looking for a modern, intuitive framework with an optimized approach for the web, Astro is an option you can't ignore. For me, it has been a game changer, and I’m sure many developers will find Astro to be an invaluable tool.

I hope this has been useful to you. After a long time considering starting a blog to share my experiences and opinions, Astro and its integration with Markdown gave me the push I needed to do it. See you in the next post! 🚀✨