
Use Gatsby.js and Headless GraphQL CMS to Make Your JAMstack Site Sweeter - mcat
https://www.takeshape.io/articles/use-gatsby-js-and-takeshape-to-make-your-jamstack-site-sweeter/
======
projectramo
I have a vague idea of why this may be useful, but I wish people who upvote a
new(ish) tech would take the time to put it in context as to why they upvoted
it, why it is interesting, and why anyone should read about it.

I am kind of sold on "static" sites, but why is this particular stack and set
of solutions so exciting? (As opposed to using, say, Rails on Heroku (which I
use as a default baseline), or even the alternative setup (Vuejs version of
Gatsby -- I am sure there is one by now, and whatever competes with graphQL).

~~~
seanwilson
> I am kind of sold on "static" sites, but why is this particular stack and
> set of solutions so exciting? (As opposed to using, say, Rails on Heroku

It's exciting because it's a static site and not using something like Rails?
The static site approach still isn't that well known. Right now, I try to use
static sites wherever I can because of their reduced complexity.

~~~
sho
> it's a static site and not using something like Rails

There's nothing "static" about this site. You're still querying a back-end
database, you've just outsourced it to a third party. And looking at the
example site, it doesn't exactly seem "simple" to me. Hell, instead of just
using one (heroku) this one relies on TWO (netlify and the authors,
takeshape).

This "stack" seems to be mainly being pushed by the people trying to sell the
3rd party backends.

~~~
lowtolerance
This approach absolutely _does_ produce static web sites, just like any other
static site generator. The querying of a back-end database doesn’t take place
when a page gets loaded, it takes place _when the static site is being built_.

This article is just talking about one approach to taking one’s content and
assembling it into a static website. The same basic workflow one should expect
when dealing with any static site generator, the only difference being in the
particulars of content aggregation and the build process.

------
brimtown
Sharing a blog post that my team wrote on some of the benefits we saw from
using Gatsby / a static frontend architecture when building
[https://shopflamingo.com](https://shopflamingo.com):
[https://medium.com/harrys-engineering/how-we-used-gatsby-
js-...](https://medium.com/harrys-engineering/how-we-used-gatsby-js-to-build-
a-blazing-fast-e-commerce-site-a9818145c67b)

In short, being able to scale to as many requests as your CDN can handle, with
none of the operational overhead of a traditional web server, is really really
nice.

~~~
specialp
Thanks for that post. That is impressive that you went with the best/fastest
tech available today rather than just leverage what was done with Harrys. I am
interested with what you actually used for the e-commerce part of it. Are you
interacting with your systems that you made for Harrys with GraphQL or did you
use a JAM stack orientated solution like gocommerce?

~~~
brimtown
Thank you! We have plans to build many more frontends in the coming years, so
it felt like an appropriate time to step back and see what other solutions
were out there.

For the e-commerce part of it, it's a custom API written in Scala that handles
our inventory, warehouse, and fulfillment needs. As well as interfacing with
Stripe for actual order processing. Want to get that team to write their own
blog post as several people have asked about it!

------
gk1
For anyone wondering about the meaning of "JAMstack":
[https://jamstack.org/](https://jamstack.org/)

~~~
mcat
JAMstack

Javascript APIs Markup

Coined by Matt Biilmann, Co-founder of Netlify

~~~
sho
> Javascript APIs Markup

In other words, every single page application ever built?

~~~
monicatie
The [https://jamstack.org/](https://jamstack.org/) page lists some examples of
apps that are not JAMstack. Isomorphic sites and sites built with a CMS are
examples.

------
nbrempel
I’ve been doing some research on headless CMS options.

Two other good options are:

[https://www.netlifycms.org](https://www.netlifycms.org)

And

[https://docs.ghost.org/api/gatsby/](https://docs.ghost.org/api/gatsby/)

~~~
sgallant
[https://forestry.io](https://forestry.io) just launched beta support for
Gatsby (like today). Forestry.io is a CMS for markdown + Git, where all edits
get committed to your repo.

If you want access to the beta, message the folks at support@forestry.io.

------
palerdot
> In this conclusion to our 4 part series, you'll learn how to used Gatsby.js
> and TakeShape to make your JAMstack site sweeter.

There is a grammatical typo in the opening headline which should read 'how to
use Gatsby.js ...'.

~~~
asprouse
Fixed! Thanks for bringing this to our attention.

------
mlukaszczyk
Gatsby did a great job incorporating Mikhail Novikov's work on the Gatsby
Source GraphQL plugin. Kudos!

If you want to see another example of Gatsby powered by a GraphQL native CMS,
check out the following tutorial:
[https://docs.graphcms.com/tutorials/developers/gatsby_and_gr...](https://docs.graphcms.com/tutorials/developers/gatsby_and_graphcms)

------
cphoover
Who comes up with these names: "JAMstack"??

It's like someone is trying to market/brand programming paradigms that
otherwise would be common patterns.

~~~
mcat
Matt Billman, the Co-founder of Netlify came up with the name to try to
counteract the perceptions of non-technical users that Static Sites meant
sites that didn't have any kind of dynamic functionality.

He came up with the name in his living room over beers.

Neat podcast episode about the etymology here -
[https://www.heavybit.com/library/podcasts/jamstack-
radio/ep-...](https://www.heavybit.com/library/podcasts/jamstack-
radio/ep-2-the-jamstack-origin-story/)

