- Astro Weekly
- Astro Weekly #5
Astro Weekly #5
Click or treat. Happy Halloween!
It’s been yet another spooktacular week for Astro, with some big updates shipped, plus our usual helping of treats from the community. Let’s get into it.
This week in Astro 🎃
HTMX in Astro?
Astro 3.4 released 😱
I'm not entirely certain what kind of witchcraft and wizardry is brewing with the Astro team, but the lightning-fast pace of new features since the release of Astro 3.0 is downright spooky.
Following closely on the heels of the Picture component in 3.3, Astro 3.4 has been released, bringing with it some frightfully good updates. Among these, the most significant is the introduction of Page Partials.
When paired with a rendering library, partials provide an alternative method to Astro islands and <script> tags for creating dynamic content within Astro.
Explain this to me like I am a 5-year-old child on Halloween…
Okay, imagine you have a magic book. When you touch a picture in the book, it can instantly change into a new picture without needing to turn the page.
A rendering library, let’s say htmx, is like that magic book for websites. It helps parts of a webpage change without having to reload the whole page.
To mark any page as a partial, simply set the new partial option in the component frontmatter.
export const partial = true;
<li>Eye of newt and toe of frog</li>
You can read a full breakdown of what’s new in Astro 3.4, including performance improvements to image generation, a new experimental dev overlay, and the usual bug fixes on the official Astro blog.
Astro Community 👻
Something we cannot see is at work
Dark matter is a mysterious and invisible substance that makes up approx. 27% of the universe.
Darkmatter converts Astro’s content collections config into a UI anyone can use to manage your website content.
Now we’ve cleared that important detail up, let’s take a deeper look into this cool new project by Vadim Demedes.
Darkmatter empowers you to effortlessly handle your Astro site's content through an intuitive interface reminiscent of a traditional CMS. By scanning Zod collection schemas, it automatically generates a form interface, allowing you to populate your front matter without the need to launch an IDE.
Create, edit, and delete collection entries in a UI that adapts to each collection's Zod schema.
Populate front matter in an intuitive UI.
Drag & drop images into Markdown from anywhere.
Preview how your content will look before publishing.
Commit and push to git directly from Darkmatter.
Darkmatter is available to try for free for 14 days ✨
If you're eager to dive deeper into Darkmatter, I highly recommend watching Chris Pennington's informative walkthrough on YouTube.
How to use Astro with a sprinkling of React 🧙
Does the thought of migrating away from a React-based framework seem a little scary to you?
Astro Showcase 💀
Also known as Angular Fever
In the spirit of Halloween, our spotlight this week is eerily impressive.
Remember, View Transitions remains an experimental feature in some browsers, so be sure to check it out using a supported browser for the best results.
Beyond the Astrosphere 🪦
What caught my eye outside of Astro this week…
That’s all for this week!
If you’re enjoying Astro Weekly as much as I enjoy Reese’s on Halloween, I’d love to hear your feedback, just like our good friend, Maxi!
If you're not yet subscribed to Astro Weekly, you're really missing out! It's a short and sweet newsletter full of the latest news and resources from the Astro and web dev community. I highly recommend checking it out! 🚀
— Maxi Ferreira (@charca)
Oct 27, 2023
Have a great week, Astronauts!
– Nathan 🧟♂️