🔔 This article was originally posted on my site, MihaiBojin.com. 🔔
Today I switched my site's hosting from Gatsby Cloud to Vercel.
After writing my latest post on application design, I ran into an issue I couldn't quite solve.
So I decided to take this opportunity and try out Vercel!
Prerequisites
Before we go any further, take a moment to check your package.json
file. It should contain the engine
section, enabling Vercel to use the same version as on your local development environment.
{
"engines": {
"node": ">=14.17 <15"
},
}
Hosting on Vercel
Porting my site over was super easy:
First, I went to https://vercel.com/new, where I clicked Add GitHub Org or Account, authenticated with my GitHub credentials, and imported my site's repository.
Vercel automatically detected I was using GatsbyJS and preconfigured the project for me.
All I had to do was to click Deploy! Vercel promptly built my site and started serving it on a subdomain. Done (or not quite)!
Custom domain
Since I wanted to use my own domain, I had to do a bit of extra config.
Vercel's domains page is a good starting point, but you can also achieve the same from your project's dashboard.
I manage all my domains using Cloudflare and maintain DNS records using Terraform, so I had to update my zone config and reapply them.
Here is the Terraform HCL I used, which can be adapted and applied with terraform plan && terraform apply
.
resource "cloudflare_record" "com_mihaibojin_apex" {
zone_id = var.zone_id_com_mihaibojin
name = "mihaibojin.com"
value = "76.76.21.21"
type = "A"
}
resource "cloudflare_record" "com_mihaibojin_vercel_cname" {
zone_id = var.zone_id_com_mihaibojin
name = "www"
value = "cname.vercel-dns.com"
type = "CNAME"
}
That's all, folks
And that was it! After a few minutes of simple configurations, my site is now hosted on Vercel.
What's even cooler is that its performance (judging by the Lighthouse report) seems to be a bit better!
If you liked this article and want to read more like it, please subscribe to my newsletter; I send one out every few weeks!
Top comments (0)