Mar 28 2023
Retreating from a TIL page to build a tag archive
Sometimes I choose the most difficult way to do something. And in this case, it may have been wanting to build a collection similar to posts, but with til as Today-I-Learned snippets to keep them separate from other writing. But…
So now I am separating out posts with the ‘til’ tag to display on a separate page. I may still run into the first and second issues, but for the most part, it will be okay.
Except that I’m still having issues with the map function getting the post properties. For the life of me, post.url and post.frontmatter.url and post.slug etc. all come up as undefined. The path to my folder of posts is correct, and spelling is all okay. I’m not sure why, other than it must be some tiny tiny issue that I’m overlooking on end.
And there it is: Astro’s Content Collection documentation staring me right in the face, which I’ve read over four or five times but only caught now.
Filtering collection queries
getCollection()takes an optional “filter” callback that allows you to filter your query based on an entry’s id, slug, or data (frontmatter) properties.
It was incredibly helpful to compare the Astro tutorial with Elian’s and Sarah’s posts on their respective experiences with building tag pages in Astro.
I’m happy it’s working. Do I entirely know why? I think I’m missing something in my understanding of passing props and params, especially when TypeScript enters the picture. I still don’t entirely understand why post.slug wasn’t working previously, but I’m happy that things are working out now. And I was able to use this to create a corresponding tag index page.