Domenico Tenace

Posted on Jan 10 • Updated on Apr 27 • Originally published at domenicotenace.dev

Astro: the new frontier of Frontend Frameworks 🪐

#astro #javascript #frontend #webdev

Overview

In the historical period in which we live, the frontend world is saturated with frameworks: Vue, React, Angular, just to name the most famous.
All technologies focused on making the developer's life much easier, without really caring too much about performance.
In recent years, frontend frameworks have been emerging that focus on performance and speed: Astro is part of this generation of technologies.
In this article will show you what is Astro and how it works.
Let's start! 🤙

What is Astro?

Astro is the web framework for building content-driven websites like blogs, portfolio, and e-commerce.
With Astro, the way has been opened for a new frontend architecture to reduce the overhead and complexity of JavaScript when loading web pages, making the site fast and SEO friendly.

The five principles of Astro's philosophy

Astro was designed based on five fundamental principles to explain the need that led to its development and the problems it needs to solve:

Content-driven: Astro was designed to give its all when developing content-focused products.
Server-first: websites run faster when they render HTML on the server.
Fast by default: Astro is all about performance, which is why it is very difficult to create a slow product.
Easy to use: You don’t need to be an expert to build something with Astro.
Developer-focused: the developer has everything he needs for his work at his disposal.

Main features

Astro includes everything you need to create a website, built-in. There are also hundreds of different integrations and API hooks available to customize a project to your exact use case and needs.

Some highlights include:

Islands: a web architecture based on "isolated" components that load JavaScript only when needed.
UI-agnostic: supports many frontend frameworks, liks React, Preact, Svelte, Vue, Solid, Lit, HTMX, web components.
Zero JS, by default: JavaScript is loaded only if necessary.
Content collections: organize, validate, and provide TypeScript type-safety for your Markdown content.
Customizable: easily integrated with many of the most popular plugins.

Conclusion

Astro is a new content- and performance-driven frontend framework that is easy to use and has everything you need to start developing a new project.
We will hear a lot about it in the future.
Happy coding!✨

Hi👋🏻
My name is Domenico, software developer passionate of Vue.js framework, I write article about it for share my knowledge and experience.
Don't forget to visit my Linktree to discover my projects 🫰🏻

Linktree: https://linktr.ee/domenicotenace

Follow me on dev.to for other articles 👇🏻

Domenico Tenace

Passionate about the IT world and everything related to it ✌🏻 Vue and Open Source enthusiastic 🦠

Top comments (14)

Alex Lohr • Jan 11

Astro is a great choice when you have a lot of static content. The ability to use different framework's components is also immensely helpful for migrations. However, if neither of those are the case, it is merely overhead.

Domenico Tenace • Jan 11

Absolutely true!
Astro was born to avoid unnecessary JavaScript use.

It's their philosophy!

Petipois • Jan 18

I absolutely love Astro. I recently created a YouTube tutorial series called Canva to Astro, converting a canvas template to astro 4. Absolutely great framework.

Thanks for the article

Nikola Mitic • Jan 17 • Edited

Thank you for the introduction ☺️

Question 🤔 Why is it a frontend framework when the emphasis is on shipping zero JS? (Which I think is great btw)

I'm getting very confused with the naming out there recently.

Domenico Tenace • Jan 19

Hi!
it was a pleasure!

Regarding your question, I can tell you that although an Astro project in production does not use JavaScript unless necessary, during development this language is present and is part of many constructs!
For this reason it can be considered a frontend framework.

Giuliano1993 • Jan 10

I really like Astro, I haven't tried it yet but I'm planning to use it for building some side-projects page! Still, great article, gives a nice overview of Astro and now really feel even more like build something with it!