This is how I set up my goofy blog
A very simple but detailed explanation on how I managed to build a personal blog using a very useful template from Sanity and Next.js, everything is FREE!
Why do I want to build a blog in the first place?
Building a personal blog has been one of the to do lists I've always wanted to do. Just simply because I have a lot of things that I want to share, using my own personal platform. That sounds exciting right?
In this first blog, I will try to explain to you on how I created this custom blog with a lot of customization features.
Choosing the right frameworks and other tools
The first thing that came to my mind was "how can I build a blog in a very simple way, but can be easily customized?" And obviously I will have to setup a CMS for that, right? Then I started to do some research on the best CMS tool for React and Next.js (I am basically very used to React).
Then not for long, I stumbled upon Sanity. By the time I heard that name I thought it was a joke lol. However as I did some more research on this tool, I found that this was pretty cool, easy to customize and I didn't have to setup any difficult technical challenges like seting up the database structure, api connection between the cms panel and frontend, etc. You heard that right, Sanity does everything for us! They even host our cms panel for FREE which is kinda nuts (obviously there are limitations for the Free Tier but hey, at least my blog can be up and running). Moreover, it has one of the best integration with React especially Next.js which sounds too good to be true lol.
So that's how I ended up choosing this amazing tool
Getting started with Sanity
Just like what any other developers would do, I started learning Sanity by watching videos on YouTube. I didn't want to spend too much time on tutorials, just needed to understand the basic concept and how to set it up. So I ended up with the most important tutorial and explanation on earth, Content Platform Spent in 100 seconds by Fireship. I bet everyone would watch this channel everytime they found a new tech o explore.
After getting to know on how to set this thing up, I then tried to read the Sanity Documentation. By the time I got to their site I already found what I'd been looking for.
A template for Next.js with all of the core cms customization 🤫
THIS IS IT!! I CAN FINALLY SET THIS THING UP WITHOUT ANY HASSLE!!
Since I just want to focus on the content, I was so glad that I found this amazing template.
1. Setting up Sanity and get this thing running
It's surprisingly easy to use the template, you basically can just go to the Sanity and Next.js Template List. If you want to get fancy like I do, you can use this Turbo Start template.
After following the basic starter on the Turbo Start template, you will basically end up with a Next.js and Sanity studio project that will run on localhost:3000 and localhost:3333. The studio basically gives you call of the flexibility on how to do any customization from the homepage, blog page, navigation bar, footer, and even creating a new custom page.
2. Setting up for deployment and dealing with the technical problems
Alright, so at this point we already have the frontend and cms running on our localhost.We need to deploy this application now. Luckily for us, sanity provides us with an easy, free, and powerful way to host the CMS studio.
this is still in progress...