back to posts

July 14, 2024

Renewing My Blog: The Journey from 2020 to Now

Updating my 2020 blog with Next.js and Vercel, updating the tech stack and fixing SEO issues.

Drawing of a sticky figure of me with a traffic cone on the head holding a sign saying 'good enough' below a big sign saying 'New Stuff'. On the left side some trash and some barrier

As mentioned in my previous post I've completely renewed my blog. One thing still pending is to have posts in both English and Portuguese. Sorry this is still only in English, but this is my next milestone to work on. On the context section you can understand why. Well…. Portuguese is my mother tongue and that's it basically.

TLDR;

I built my blog 2020 with React, Gatsby, and deploying to Netlify following a tutorial. I used to post regularly but stopped due to anxiety, impostor syndrome and other stuff. In 2021 my life changed. Recently I decided to revive and renew my blog, building everything almost from scratch on my own. I switched to Next.js and Vercel for deployment and linking my subdomain. And also updating the Ubuntu server to the latest version. Faced some issues related to SEO - duplicate content and fixed adding canonical tags. The blog is now here, and hopefully will support English and Portuguese language soon, which can lead to some more SEO issues, but I will fix it when it comes. 💪🏽

“TLIWR - Too Long I Wanna Read” 😅

# Context

The previous version of the blog I built in 2020, I used a tutorial from Willian Justen using React with Gatsby and deploying to Netlify. There were also some Progressive web apps (PWA) functionalities which back then I was enthusiastic about. I also had an admin page for writing and publishing the posts and at the end generating a markdown file.

The blog was well indexed, there was also a comment section. It worked well, in 2020. My goal back then was posting every Sunday.

Screenshot of previous version of my blog

Time passed by, my motivation to post was decreasing. Anxiety, impostor syndrome and many other reasons. I stopped posting.

But also everything changed in my life in 2021.

During this time I occasionally reflected on how my blog was a good thing. It was my personal space to share some stuff like learnings, explanation of technical topics, reflections. I also used it as a reference, especially when I had to remember how I had done things.

"How do I use reduce in Javascript?? I forgot..."

Google Search Console also shows me some reports about searches and clicks related to my blog. That always surprised me.

Google Search console report of clicks and search

I also found an old comment on a post which warmed my heart. Someone said that they loved the explanation I made on the post and it was easy to understand ✨. Ohhh that was so nice to read. And that resonates a lot with what I like, making things simple. Simple to understand.

During all this time I've learned so much, and sometimes I find it difficult to remember my learnings. It's also hard to acknowledge my own knowledge, skills, expertise and all the amazing things I have built.

“I want to share my learnings again. And some reflection as well.”

Well.. this year I decided to come back, I procrastinated a lot though.

However the blog was untouched for almost 3 years, therefore everything was outdated.

# Blog technical changes

The major ones:

  • Gatsby back then was version 2. Today is version 5.
  • React was version 16. Today is 20.

For almost 2 hours I tried to take care of all the dependencies, due to many major changes it could only end up in a chaos.

"Well… The blog needs a makeover anyway right? 😅”

Drawing of sticky figure of me with a traffic cone on the head putting a box with the name 'Gatsby 2.0' on the trash

I decided to rebuild everything using Next.js as I have some experience with it because of work and decided to deploy to my server using Github Actions and run the application inside a container.

Work to be done:

  • Get all markdown files from my previous blog version to have it on this new version;
  • Add Google Analytics;
  • Have the application running and configure Github Actions;
  • Run docker on my server and link it to my subdomain;

Building the application was fun, I spent an entire Saturday developing it with the old posts already on it. I still had to improve other stuff though.

# Deployment + Server changes

As I had decided to deploy to my server, another neglected area was about to come. Since 2021 I haven't done anything on my server, just paying for it 💸. And it was running on Ubuntu 16.04 with an old Node version and some old stuff.

"Well… It needs a makeover anyway right? 😅”

I created a new server with Ubuntu 24.04 LTS and reconfigured everything. Setting up Nginx, installing some packages and configuring my domain. After a long afternoon, everything was working. I deleted the old server and kept just the new one. It was good to refresh my brain on this topic.

However, running the blog on this simple server with Docker was problematic due to memory constraints. My server has just 1GB memory and running Docker on there was definitely a NO GO. My deployment process was also super simple, building the image directly on the server. Though I could create a lightweight Docker image by building my application in a standalone output on Next.js, running it was just consuming all the memory.

I was just imagining my server "somewhere in the world” in some room just suddenly exploding.

Drawing with two squares. Inside the first square is a drawing of a server and a legend saying 'my server' and the server has smoke coming out of it. Second square the same server exploded

I just deleted everything Docker related on my server and decided to deploy on Vercel. I made it work in less than 30 min. The remaining task was to link it with my subdomain.

I changed the CNAME on my DNS host and all was good.

Best decision ever. “Why over complicate stuff, Talita?” Well, sometimes it's nice to try out things and have some learning.

# SEO Challenges

  • On Google Analytics I had a message to update to Google Analytics 4 ;
  • Page indexation issues;

I received an email from Google Search Console, some posts were flagged as "Duplicate without user-selected canonical” where not being indexed.

Page indexation issues. Issue of Duplicate without user-selected canonical

I'm not 100% sure of the specific reason, because I have the same content on the same path. But something might have changed compared to the way that the post is being rendered before.

For that I had to add canonical tags on my posts. Basically telling Google that this version is the preferred one. It took 3 days to reindex but it's finally fixed. 🙌🏽

Page indexation fixed

Everything now it's working more smoothly and there are still some improvements to do around here. The main one I see now is having posts both in English and Portuguese. I'm working on that, slowly… respecting my time. I expect that this will also lead to some more SEO issues, but it's part of the process.

If you're still here. Thanks for reading :)

back to posts