No tool in the Jamstack ecosystem has made more steps towards an optimal developer experience than Gatsby.

What started as a simple, albeit performant, static site generator is today so much more than that.

One recent example of this ongoing progress was the release of Gatsby Recipes, which allow even more automation in the site-building process.

When we stumbled upon this, we automatically thought: “Here’s the perfect occasion to ease up an e-commerce integration for Gatsby projects!”

So today, we’re glad to present to you our new Gatsby e-commerce recipe.

This post will explain how we’ve built it and how you can use it for your own Gatsby e-commerce website.

Let’s start by clearing up what are Gatsby recipes exactly.

What are Gatsby recipes?

A Gatsby recipe is scripted as a series of steps taken to configure your site to the desired state, or to quickly add new things to your site.

It enables the automation of multiple tasks such as creating pages and layouts, setting up TypeScript, run npm installs, adding data to GraphQL, etc. Or, in our case, installing and setting up a plugin.

Oh, and Recipes are run directly from Gatsby’s CLI!

Under the hood, these “steps” are defined in a single MDX file—a combination of Markdown and React components. Using Markdown allows the steps to complete a task to be listed in a human-readable way. That will undoubtedly simplify the process for many users.

Out of the box, Gatsby offers many official recipes. Find out which tasks you can already use recipes for by running gatsby recipes in your terminal.

If you don’t find something you’d like to automate for your Gatsby projects, it’s quite easy to create your own recipe. The tutorial below will show you how to do so. Our example allows the installation of a Snipcart plugin that enables e-commerce on Gatsby websites quickly.

→ Read the full post here