I migrated my blog to Netlify
I developed this blog 2 years ago as a Jampstack site, and in that 2 years long, I only published 4 posts in total :) Now I decided to move it from Firebase to Netlify. I know, all I've done so far is f*cking over-engineering.
I am so lazy in writing blog, so why do have to spend many hours developing this? Why don't I just use a free service like Wordpress? it will take only 20 seconds to signup. The answer is very simple: Because I want to try new things and it's fun.
So let's come back to the topic, what's wrong with my old blog version?
The stupid version
As I mentioned in the post 2 years ago, my blog was a Jampstack using Gridsome, content is written & stored on Wordpress.com, and the generated site will be deployed to Firebase Hosting. The problem of this approach is it cannot be fully automated. So when I want to publish a new post, the steps were:
- Go to my site on Wordpress.com, write a new post there.
- Then in the web repository on my local computer, I need to run
npm run build
so it will get new posts from Wordpress API and generate it into static files - Afterward, need to run firebase deploy so it will deploy the new version to Firebase Hosting.
See? How complicated it is to write a small blog post that no one read :)
Actually, steps #2 and #3 can be fully automated if Firebase provides a webhook to trigger deployment. But that is a free service, so they don't want to give me an easy way, I guess.
Why did I choose this stupid approach 2 years ago? The reason is that I love the Wordpress editor and I am so familiar with that. So I stuck with WP and find around to see any possible solution to keep using WP editor for my blog.
The smarter version
Last year, I helped a client to build a course website in fully Jampstack technologies. Including all these functionalities:
- Sign up / sign in, role authentication.
- Post videos, comments, text content.
- Membership, plans for the subscription.
- Payment methods
- And more...
Let me emphasize one more time, I've built an ecommerce website in Jampstack. Before this project, I thought that Jampstack is only for simple websites like my blog, I didn't know that we can play many other things with it.
I've learned many new things by working on that project, and one of them is that Netlify also have a free plan (I didn't know it), and how to write & store content with NetlifyCMS.
So last week, I decided to migrate my blog to Netlify instead of Firebase, and use NetlifyCMS instead of Wordpress. From now on, everything is automated. When I publish a new post on CMS, it will:
- Store the content to markdown files, and then commit directly to my Github repo.
- Then trigger a build pipeline on Netlify to generate new static version.
- Afterward, deploy to production if triggered from the
master
branch. In another hand, it will deploy a preview version if the commit is coming from another branch.
When I save the post as draft, it will commit to a new branch and create a PR to master. It will also auto deploy a preview version and comment to the PR like this:
All I need to do now is try to write content more frequently, stop lazy Phuc.
P/s: By the way, you don't have to use Netlify as hosting when using NetlifyCMS. You can use Firebase Hosting combined with Github Action, so every time you save something on NetlifyCMS, it will trigger Github action to deploy a new version to Firebase for you. Another good option is Vercel, it also has a free plan and deployment pipeline just like Netlify.