TL;DR: Rebuilt my blog (this page) with Nuxt in order to improve SEO and performance and give the whole thing a new look. Used Tailwind too (well, duh!)
I felt like it was about time I tried my hands on Nuxt. Considering that Vue is my goto frontend framework, Nuxt was inevitable to be skipped. Though, I cannot just learn a language, I need to build something in order to get to know the language all around. So I started wondering what would be a perfect project to build with Nuxt.
Why Nuxt?
So in order to know what project would be perfect for Nuxt, I started researching a bit on why Nuxt would be better as compared to Vue. Obviously, I came across SSR a lot more that I expected to. So it was time, I dived into SSR and built something that could benefit from it.
If you would just do a google search Why is SSR good, you'd be easily prompted to a lot of sites, however all these sites will have one thing in common, SSR is good for SEO. You see where this is going?
Out of all the apps that I have currently, this blog is the one that will be able to leverage SEO the most and yeah I was kinda bored of the old design, really started disliking it after a while.
So that was that. I started rebuilding my blog. The backend is still the same. The same old API built on FastAPI.
Features
Yeah, I had to list down the features that I think are way better in this version. Some of the key highlights are:
- Way faster
- Improved SEO
- Better theme
- Better dark mode
- Comments (thanks to utteranc.es)
- Everything is better
Yeah, I honestly think this version is pretty good. I mean the older one was not bad by any means, but a lot of things were just not perfect for a blog. Things like the SEO takes the whole page a long way along.
Theme
Since I have recently started using Tailwind, I went with tailwind again and I have to admit, I like it a bit more every time I use it. It just makes so many things so much easier. Things like handling a dark theme. Talking about dark themes, consider checking out the dark theme. Just open the menu (if you're on mobile) and click on the sun icon.
The themes are also set based on the device theme (if the user has not explicitly set a theme). I wanted to keep an option with auto that would theme the site based on the users mobile, however, I just couldn't find the motivation to add that. Perhaps in the next release?!
Comments
Okay, this is a big one. I was just going through a blog site and I came accross utterances, and I have to say it's a pretty neat idea. Like the whole thing is very easy to setup.
However, I will have to call it both an advantange and a disadvantage that it is built on GitHub. This means, if the blog has readers that do not have a GitHub account, would not be able to comment.
However, if the blog has readers that are mostly techies (read people with GitHub account), then it is like a wish come true. I think being built on GitHub, it is like an extra push for techies to comment.
But, it is what it is, it depends on the readers whether it would be a good idea.
Redesigned share menu
So, the share menu is now redesigned. It still continues the old approach however. If your device supports native share, then the custom menu will not be shown. However, most PC's does not really support it (can't vouch for Windows, totally doesn't work on i3-gaps), so the custom menu is a great addition.
Check it out by clicking on the share button at the end of the post, or at the top of the post.
Conclusion
I think, all things, considered, this was a pretty good chance for me to learn Nuxt and I totally enjoyed. I am already considering Nuxt for my upcoming projects. It's ofcourse good for SEO, however the whole SSR thing makes it very convinient to make the site performant. Also, really appreciate that the app is automatically built as a PWA. Anyway, some more posts coming up in the following days, consider subscirbing to the newsletter!
Also, the repo is now open source, in case you are interested, check it out.
Top comments (0)