11ty Migration

I realized my website was begging for pagination-- asking visitors to load 10s of high-quality images was embarrassing me, haha. Let alone the 100s of images I hope to have on here eventually!

I also realized that I was duplicating a lot of HTML, and I know from programming games that you don't want to be copy/pasting anything. I had heard before of "static site generation" but I had no idea how that worked on any level. I can barely use CSS to make a decent looking site (still!), so I knew it was going to be a daunting task but a worthwhile one. I decided to do this after stumbling across a post mentioning 11ty, and so I chose to use 11ty as my static site generator with the help of the Nunjucks templating language.

Originally I wanted to write up a little thing about all of the roadblocks I ran into while trying to do this migration (because this was my first foray into what I'd properly call web development and it took me days to even understand how to use a JSON file properly) but I realize that that will be a much larger undertaking to explain in a helpful manner. An undertaking that would delay posting more of my art.

So instead, for now, I must point to PetraPixel's tutorial which was what allowed me to even start trying. This article about making a traditional blog with 11ty was also extremely useful to me.

What did I use it for?

Just to give you an idea (and hopefully to inspire others to optimize their site creation) here's a list of what I've used 11ty and Nunjucks to do:
• Pagination
• Filtering posts
• Automatically create posts for my writing using excerpts of the writing itself (so I only need to write something once w/o any copying and pasting!)
• Convert shortcode into mutant standard emoji w/o needing to write the whole img tag myself