Dev Diary #1: Look mom!
Time travel back to February 2nd, 2022. That was the first major delay I made while I was working on this blog. I created a draft post regarding how to build a discord bot- scratch that, I didn’t even make a tutorial, it’s literally just the metadata and that’s it.
After that, I left the repository alone for more than a year, left it to rot, unlinked, and looking ugly as heck. I did it injustice.
That is until today.
I looked back at my repository list in GitHub again, and hey, at the bottom of it, the blog
repo. I had nothing else to do today, so I thought to myself: “Why not breathe life again into this project?”, and so I did.
Stage 1: Cleanup
There were some remains of the old setup left that cluttered the repository, so I deleted them all, including the skeleton “make a discord bot” post. I also had a lot of cross-repository resource sharing that really messed with styling on this site, especially after I reworked the main root site before this.
There’s also a teeny-tiny issue that I have, I don’t know anything about Jekyll, or Liquid.
Stage 2: Learning
Markdown was the easy part, Jekyll was as easy as looking at the docs, Liquid, however, was the part that irritated me. Being an avid user of MediaWiki, I am very accustomed to brackets, brackets everywhere. I thought if I did another thing other than editing wikis, I would have a break from this hell.
Nope.
{% for post in site.posts %}
<li class="post-link">
<a href="/blog{{ post.url }}">{{ post.title }}</a> (<span class="post-tags">{{ post.tags }}</span>) - <span class="post-date">{{ post.date | date: "%B %d, %Y" }}</span></li>
{% endfor %}
And worst of all, Liquid behaves differently from what I am used to. Fortunately, ChatGPT is here to help, after some extremely basic courses through the chatbot, I was able to create some pretty OK Jekyll and Liquid setup. It was pretty nice.
Stage 3: Rebuilding
Rebuilding everything from scratch. Includes, layouts, templates, assets, everything had to be remade. I started with boilerplating my CSS, created a semantic HTML layout, then the includes like the header and footer.
One of my main gripes is responsiveness, my main site, as of the time of this writing, is NOT responsive, it’s such a shame. And I remade my main site many more times than this one. I realised one of the big things for creating a responsive layout is to let the browser do its scaling, I don’t even need to set up fancy stuff like viewport units, just good design practices (that came from unfruitful experiences).
I also prioritised user experience as to keep myself from getting headaches as well, line heights are expanded, content width is lessened but not to the point of an anorexic article (visit the site in a mobile viewport and you’ll see what I mean), and heading sizes are enlargened.
Stage 4: Republishing
When everything is fine again, it was time to publish my first proper blog post: https://headquarter8302.github.io/blog/2023/11/16/test.html. It was simple but it’s honest work.
Conclusion
It was a fun excercise, and I finally finished my project. Even though I almost left it to die, at least I have a place to write in the future.