picture of cat
OnscreenProton

Rewrite of blog

Update

I think I finally got this site working with eleventy and gh-pages! It was mostly not my work since I took a lot of the site from the Eleventy example blog and from a layout from teppy, but I put some small finishing touches on my self. Hopefully I have the motivation to continue writing here, but even if I don't, I at least know this blog is mine.

New layout

So when I decided that I wanted to reboot this blog/personal website, I knew I wanted it to be simpler and built more from the ground up. While I orignally was going to do the whole site in vanilla HTML, CSS, and JS, I decided that if I were actually using the blog, it would be worth the effort to use a static site generator. Comparing Astro, Hugo, Jekkyl, and more, I eventually decided that I would write the site using Eleventy. Eleventy seemed relatively simple to use and to move to from just HTML. This made it easier for me to use an existing layout and theme that I liked.

However, it has been quite a bit since I've written/programmed anything. I was almost dead off the water from the start. Luckily, Eleventy is quite popular and I was able to quickly learn just enough to start (although I didn't really learn much since most of this site is a copy of other's work).

Firstly, I started by converting the layout into different Nunjucks components. While I originally grappled with not changing the CSS and HTML and sticking with seperate base.njk and header.njk, I folded and decided that since the navigation bar was simple enough, I would just put it within base.njk.

After that, I moved the actual website content from base.njk to index.md so it would be easier for me to edit the home page of the site if I needed to. With this, I now had a somewhat working website. I still wanted to add more though.

While I had an existing blog, I never used it and thought that it should have a refresh while I was already working on this site. So I decided that I should also write the blog using Eleventy. This turned out to be really easy to implement since there was an existing blog template provided by the Eleventy authors. This blog fit my needs really well; it was really simple, it supports code blocks through prismjs, and seemed pretty simple to implement into my existing site.

I still haven't flushed out all the kinks of this setup and would like to set up a few more things. I've been trying for a while to create a simple button in the nav bar that allows changing from dark to light mode but have not been able to figure out how to do this without changing a bunch of other things. I also would like to figure out how the image templates from the example blog work so that images are better for web use. I tried to get it to work, but relative pathes kept messing me up. Finally, I would like to rewrite the parts I took from others to be my own work. It kinda feels like I'm stealing by using everyone else's work.

If you're still reading this, I would like to thank you. Hopefully I'll write something else after this.