A comparison based on the experience of building the same site in both frameworks
I had an idea for a potential client that would involve a static site with lots of various types of content. The main sticking point would be that the platform would need to be polished and reliable enough on its own for the client to make changes with no developer present. Since this site is essentially a very simple example/prototype of that, I decided to rebuild it using Gatsby & Netlify CMS. It was already built using React-Snap & Create-React-App.
While Gatsby and Netlify CMS provide one-click templates that are at easy to setup as something as complicated as a Gatsby site could be, there is nothing simpler than Create-React-App. In addition, React-Snap lives up to its Zero-Configuration promise, and worked right out of the box.
Now, there is something to be said for what you receive once you have Gatsby set up, as the result is far greater in terms of functionality. You receive things like lazy image loading, automatic markdown parsing, and with Netlify CMS, an admin panel to administer and change content. In addition, there are many plugins to easily setup items like sitemap generation and Google Analytics integration. I would suggest that some to all of these features are desired on all but the simplest of sites, so unless you are designing a one page brochure, they are likely worth the additional configuration needs.
I believe that both solutions use react router under the hood, but the way you will interact with them could not be more different.
For Gatsby, your routing is much more declarative and also intensive. You have essentially two choices:
You can also query in information and generate pages that way, so long as it is able to be done in GraphQL. This is a bit limiting, but you could always set up an API in front of a REST API to handle this.
This section obviously may or may not apply to you, but I like to write larger projects in Typescript, so I figured I would weigh in here.
React-Snap integrates TypeScript the same way any React project does. It is very easy and saves you time.
Gatsby has the ability to use TypeScript as well, and has a plugin to handle the compilation to JS. I did not run into many issues, but wanted to list the ones I did encounter here:
The actual GraphQL query results use PropTypes by default. It may or may not be possible to convert them, I did not try. (Update: PropTypes were surprisingly easy to replace with interfaces.)
I am a very firm believer in TypeScript, but at the end of this process, I am not sure it is worth trying to integrate into Gatsby, and likely cost me more time than it saved (first project of any size I can say that about).
For React-Snap, you can either manually create content, which is what I was doing, or integrate some outside service manually.
For Gatsby, Netlify CMS can be integrated out of the box. This is a massive boon for content creation, and the configuration process for Netlify CMS with GitHub was very painless. They have obviously thought through the developer experience.
For the editorial process inside Netlify CMS, I found the overall experience to be very well designed. The UI is pleasant and fairly easy to work with. However, I did not find the experience to live up to my hopes of being able to hand off the tool to a company with no developers on staff. This was mostly due to small quibbles:
All in all though, the experience was quite lovely and intuitive, including the editorial workflow (which you should definitely turn on).
Verdict: Gatsby (NetlifyCMS)
I believe that for projects of any real size, that the heft of Gatsby is likely worth the additional effort that is required, but conversely, it struggles with TypeScript integration and unit testing, two common requirements of larger projects. That being said, React-Snap was truly seamless and gave me a much clearer and simple experience, and I wouldn't hesitate to use it in a small project.
NetlifyCMS, which could theoretically be used with either but is much easier to integrate into Gatsby, is a great experience. With a few additional capabilities, like sorting the pieces of content, could be a full replacement for something like WordPress.