Part 19: Project Tag Pages

Project Scope and ToDos

1. Static Site Generator that can build the blog and let me host it on Github Pages
2. I want to write posts in Markdown because I'm lazy, it's easy, and it is how I take notes now.
3. I don't want to spend a ton of time doing design work. I'm doing complicated designs for other projects, so I want to pull a theme I like that I can rely on someone else to keep up.
4. Once it gets going, I want template changes to be easy.
5. It should be as easy as Jekyll, so I need to be able to build it using GitHub Actions, where I can just commit a template change or Markdown file and away it goes. If I can't figure this out than fk it, just use Jekyll.
6. I require it to be used by a significant percent of my professional peers so I can get easy answers when something goes wrong.
7. I want source maps. This is a dev log site which means whatever I do with it should be easy for other developers to read.

• Also the sitemap plugin looks cool. Should grab that later.

• So does the reading time one.

• Also this TOC plugin mby?

• Use Data Deep Merge in this blog.

• Decide if I want to render the CSS fancier than just a base file and do per-template splitting.

• Is there a way to have permalinks to posts contain metadata without organizing them into subfolders?

• How do I cachebreak files on the basis of new build events? Datetime? site.github.build_revision is how Jekyll accomplishes this, but is there a way to push that into the build process for Eleventy?

• Make link text look less shitty. It looks like it is a whole, lighter, font.

• Code blocks do not have good syntax highlighting. I want good syntax highlighting.

• Build a Markdown-it plugin to take my typing shortcuts [prob, b/c, ...?] and expand them on build.

• See if we can start Markdown's interpretation of H tags to start at 2, since H1 is always pulled from the page title metadata. If it isn't easy, I just have to change my pattern of writing in the MD documents.

• Should I explore some shortcodes?

• Order projects listing by last posted blog in that project

• Limit the output of home page post lists to a specific number of posts

• Show the latest post below the site intro on the homepage.

• Tags pages with Pagination

• Posts should be able to support a preview header image that can also be shown on post lists.

Day 19

Oh let's turn on GPC

Oh, I'm not doing any personalized tracking to turn off, but I might as well register my support for GPC. It should be easy enough to set up a location for me to store .well-known data and pass it through. I'll have an internal folder at src/_well-known and set up a passthrough copy from there.

Skip code block ▼

// added to .eleventy.js
eleventyConfig.addPassthroughCopy({ "src/_well-known": ".well-known" });

Then I can just add a gpc.json file in that folder

Skip code block ▼

{
	"gpc": true,
	"lastUpdate": "2021-07-31"
}

git commit -am "Add GPC .well-known file"

Tag pages, let's do it!

Huh, my front page posts are no longer reversing properly. I think because reverse happens in-place it's causing some issues.

Let's clone the array before we operate on it in the shortcode. This will be an easy way to avoid any accidental problems.

Skip code block ▼

	eleventyConfig.addShortcode(
		"projectList",
		function (collectionName, collectionOfPosts, order, hlevel, limit) {
			var postCollection = [];
			if (collectionOfPosts) {
				postCollection = collectionOfPosts.slice();
			}

Ok, good stuff!

Now let's look into pagination of tags pages.

Ok, the reverse is not working again... wtf...

Yeah, I'm pretty sure every place I'm calling reverse now is on a clone of the collections array. My post collection pull for the index page isn't reversing, it's just slicing one off the end. I'm not sure why the ordering here is wonky. Especially because it shouldn't even be a problem. According to the Eleventy site:

Note that while Array .reverse() mutates the array in-place, all Eleventy Collection API methods return new copies of collection arrays and can be modified without side effects to other collections.

So what is happening here?

Should I just use the reverse call intended for pagination instead?

Got distracted and ended up not finishing. The downside of weekend development.

git commit -am "First run at tag pages"