The Gatsby Masterclass

The Gatsby Masterclass

image description

What you will learn

  • Build rich, fully-featured Gatsby sites / apps from project start to deployment on the web
  • Create stunning, blazing fast sites with Gatsby
  • Master GraphQL to get and manage data with your React apps
  • Utilize the best practices for building React projects


Section 1: Getting Started

Section 2: Creating our Gatsby Project

Section 3: Exploring our Gatsby Project

Section 4: Pages and Components in Gatsby

Section 5: Querying Data with GraphQL / GraphiQL IDE

Section 6: Source Plugins and Static Queries

Section 7: Transformer Plugins / Creating a Blog out of Markdown Files

Section 8: Programmatically Creating Pages with Gatsby

Section 9: GraphQL Arguments, Variables, and Page Queries

Section 10: Pagination in Gatsby

Section 11: Sorting and Filtering with GraphQL Queries / Formatting Dates and Text

Section 12: Images in Gatsby / Amazing Responsive Images with Gatsby Image

Section 13: Advanced Image Concepts in Gatsby / GraphQL Fragments

Section 14: Contentful as our Headless CMS / Creating and Managing Products with Contentful

Section 15: Creating a Shopping Cart / Checkout Functionality with Snipcart

Section 16: Deploying our Gatsby Sites with Netlify / Setting up Continuous Integration

Section 17: User Authentication in Gatsby / Netlify Identity

Course Description

Build blazing-fast, feature-rich, and overall stunning React apps with the Gatsby framework


  • Familiarity with React and ES6 JavaScript
  • Basic understanding of Git / Github


Do you want to make the fastest, most performant, and overall best React applications? Look no further than Gatsby.

This course is the best guide you'll find to learn the Gatsby framework. In it, we will be making a complete Blog and Online Store, from project start to deployment on the web.

Here's what we'll be making:

  • A complete blog / online store built entirely with Gatsby and GraphQL, User Authentication with Multi-Factor Authentication, content served from the Headless CMS Contentful, with blog posts written entirely in Markdown, and Continuous Deployment with Netlify

What will be covered?

  • How to use GraphQL in great detail, from the GraphiQL IDE to our React / Gatsby client
  • Using GraphQL variables, arguments, fragments and many more related concepts
  • Sorting and filtering operations in GraphQL Queries
  • Utilizing the cloud-hosted headless CMS Contentful for dead-simple content management
  • Executing Queries from Gatsby Client with Static Queries and Page Queries
  • Amazing Responsive Images with Gatsby Image
  • Fetching / Managing Gatsby Data with Gatsby Source Plugins
  • Transforming Data using Gatsby Transformer Plugins
  • Converting Markdown Data to HTML Content with Gatsby
  • Programmatically Creating Site Pages in Gatsby
  • Pagination in Gatsby (Prev / Next Links, Numbered Pagination)
  • User Authentication using Netlify Identity
  • Social Login with Google, Github, Gitlab, and Bitbucket Providers
  • Multi-Factor Authentication with Account Confirmation Emails
  • Shopping Cart and User Purchases with Snipcart
  • Continuous Deployment through Git / Github with Netlify
  • Routing, nested routes, links, active links in Gatsby
  • And much more...

Who this course is for:

  • React developers looking to learn the Gatsby framework
  • Developers interested in building very fast JavaScript apps
  • Programmers with a desire to build functional React apps from front to back