Gatsby vs Next.js

Hey guys,

My backend set up is Prisma / GraphQL-Yoga at the moment, and I love it. It's so intuitive to learn and is really neat on the frontend too, however, there were a few gotchas when I was learning! Especially around understanding how it all pieces together (the stack). There isn't a great deal of information out there on exactly how to put into production my set up, which is a backend set up on a Digital Ocean droplet with Prisma/GraphQL Yoga in a Docker Container using Next & Apollo Client on the frontend somewhere else. It's such a niche subject, so I bet only a few hundred people have got a website with this stack in production. Anyway, I wrote a blog post to help those who might need help understanding it. Here it is, hope it helps!

As a Frontend Developer I wanted something simple to generate static websites with technology I am familiar with. GatsbyJS was in the stack I am familiar with, does not need any other languages / package managers and allows quick content deployment in pure HTML or Markdown (what you prefer for a project). It also does not require you to understand a theming engine if you need a custom design.

Next and Gatsby come in pretty close when it comes to a lot of the front-end features, with a lot of it in favor of Gatsby. However, Next comes with first-class support for Server-Side-Rendering (SSR), while it's a bit of an afterthought in Gatsby; a lot of Gatsby's features wins are also nullified if you attempt to do SSR.

Ultimately, with Next if you want to get to the same level of polish that a Gatsby site you'll have to put in some hard work. Next is simple enough to get going and does a decent job dealing with SSR, which can be painful to deal with. I don't have first hand experience, but it's probably going to be a lot more painful trying to do SSR in Gatsby.

However, I do think that SSR is the future, for now, and Next provides the best developer experience in that regard.