Creating a Source Plugin

The goal of this tutorial is to help you create a fully-featured source plugin for Gatsby. Along the way, you'll learn key concepts and patterns of Gatsby and its plugin system. You'll source data from an example third-party API, populate Gatsby's data store and use it inside your example site.

0. Prerequisites→

Introduce yourself to the basics of a source plugin, what it does, why you should build one, and learn how this guide is structured.

1. Project Setup→

Set up your local project by cloning the companion repository and get yourself familiar with the structure and functionality.

2. Create Nodes→

Learn how to source data into Gatsby, create GraphQL nodes, and display your data in a Gatsby site.

3. Define GraphQL Schema→

Understand automatic type inference, how to explicitly define your GraphQL schema, and how to add a foreign-key relationship between GraphQL types.

4. Utilities→

Get to know different Node API helpers to further improve your plugin.

5. Incremental Builds→

Decrease the time it takes for your users to see their changes applied by optimizing your plugin with Incremental Builds.

6. Image CDN→

Instead of processing images at build time, Image CDN defers and offloads image processing to the edge.

7. Advanced Topics→

Want to learn even more? Dive into some more advanced topics.

8. Publishing→

Learn how you can publish your Gatsby source plugin to npm.

What's Next?→

Continue your Gatsby source plugin journey with these additional resources.