Tags, part 2
Posted on 22nd January 2020
Last week I started working on a feature that I ended up deciding to break into smaller incremental tasks.
If you don't fancy reading that post again, here's a recap of the goals...
- Update my blog post template to render a list of the tags used on that article
- Make a page for all the tags, so you can click on "100DaysOfGatsby" for example, and see a list of all the articles that share that tag.
- Add a tag cloud, a visualisation of the tags used on the site and their popularity.
In my previous post, I added the first of these three updates, I will admit it has been a bit weird getting used to deciding what tags to add to my articles frontmatter, but I guess over time it will prove to be helpful.
Today, I took a stab at the second of those tasks, and after a little bit of tinkering I now have myself a page that lists all the tags on the site, and also a seperate page for each tag which contain a list of all the articles that use that tag.
The main things I had to overcome with this was learning about kebabCase for creating the urls, everything else was just a variant of the things I've already done on the site so far like making pages from markdown files, rendering lists from graphql query data, etc.
I'll admit it seems like overkill having all these extra pages, it might have been better to make one page with a bunch of anchored headings, but as the official Gatsby docs told me to do it this way, I have 😇
Next time, I will have a go at making the tag cloud, I have a few ideas what it would look like, but I'll probably end up nicking a pre-made one someone has shared on codepen or medium. Heck, there might even be a Gatsby plugin for it already, who knows?!
Enjoyed this post? Feel free to share it with your audience using the links below:
Don't see your favourite social network on the list? Feel free to let me know and I'll get it added.