Read: Class 43 Gatsby, next.js, and other JS Frame - 401-advanced-javascript-muna/amman-javascript-401d1 GitHub Wiki

Gatsby, next.js, and other JS Frame Next.js a somewhat similar to Create React App, but supports server-side rendering. What it essentially means is that necessary HTML code is generated from the server itself, based on the URL. So your browser is receiving pre-rendered HTML code, not an empty ‘div’.

While CRA offers client-side rendering and Next.js offers server-side rending, Gatsby is something called “Static Site Generator”. If you’re new to static site generators, those are generators which build “HTML” code during the “build”, by fetching data from some APIs, markdown files or anything. Note that everything is done in the “build” process. Similar to Next.js browser receives pre-rendered HTML code.

Real Life Examples A Landing Page for a Product (e.g.: mfy.im) CRA – Dead simple to create one. But lacks SEO because in order to ‘view the site’, JS files must be executed

Next.js – Good for SEO, since everything is generated from the server. Since content is static you can take advantage of static export

Gatsby – Static content, so perfect of Gatsby. Also, could take advantages of plugins like AMP, PWA, inline critical CSS etc

What I’ll choose: Gatsby seems to be a winner here. However, CRA can do the same stuff with pre-rendering. Read my post: Prerender React App for SEO without SSR or Next.js. If you got enough time I would recommend Gatsby. CRA should also work fine