TIL: Making a blog

2023-01-10
TIL
javascript
website

TLDR

Today I finished my blog website, and I’ve done it using Next.js and Markdown. I got a few different options from some different colleges, but I ended up deciding this was the right option for me. If you’re interested in the initial tutorial I followed, you can find it here! My GitHub repo is also public, you can find that here.


The content

Anyways, for the first post, I learned how to make a full blog from Next.js and Markdown (as you can see). I followed a tutorial to get the inital stucture, and it took me about an hour to get oriented. I spent the second hour trying to figure out how to tag each post, and then I moved on to CSS and structure.

Some point in there, I decided I didn’t want to use Tailwind, because I had set up my previous website using Bulma, and so had all that configured already. I spent 3-4 hours converting the whole system to use Bulma, redid all the pages with the new CSS framework, and then promptly decided I hated it. I spent the next hour trying to figure out how to revert my GitHub commit, and learned a lot from Stack Overflow about best practices to properly push/pull code (and about all the things I messed up).

I reverted back to my very basic layout I had before, and over the next 2 days ended up spicing it up, adding tags and dates and making it look nice. I added sorting to put the posts in date-order, and added a today I learned section, filtered by tags in the markdown file itself.

I’ve deployed this using Vercel, which I love. I hope they don’t get rid of their free plan anytime soon 😅

The whole process took me around 12-15 hours over the course of 5 days. I definitely learned a lot, but here’s some of the highlights.

  • GitHub is complicated, and working in pull requests with branches absolutely is better than just commiting to the master branch.
  • Node.js is really cool! I really like using JavaScript to display HTML, I had never done that before. It adds a lot more flexibility and capability.
  • Tailwind is also a really nice CSS framework. I found their docs to be much easier to understand and search than Bulma, and I enjoyed working with the syntax more.

Goals and future plans

I’m hoping to use this page as a document to my progress and learnings over the next year.

My first programming love was with Javascript, and I’m honestly really happy to be building in it again. I’ve had several websites in the past, but never one written with Javascript, or as advanced as this. I found my other sites to be really hard to maintain. My hope with the markdown is I’ll be able to easily create posts and update content as I go, with the option of changing CSS as I feel. I currently have duplicate posts on my Notion page, which is more of my website and documentation for my personal life. I am really transparent with what I’m doing and learning, and you can find a lot of my daily iterations on there as well.

I can imagine the structure of this will change a lot over the course of the year, and I look forward to seeing everything I learn!

Features to add:

  • possibly sorting by tags?
  • add a footer with social tags