In this introduction video, I break down the technologies and frameworks we'll be covering throughout the videos. Specifically WordPress, Gatsby & Netlify.

In this episode, we focus on setting up a local WordPress installation on our local machine. We do this using a free tool called Local by Flywheel.

In this episode of the series I cover the essential plugins we'll need to build a GraphQL schema in our WordPress system.

In this bonus episode I cover how we can make use of Bedrock and Composer to manage our WordPress dependencies and plugins.

To get an understanding of the schema we do have available to us, we'll be using the WPGraphiQL plugin within our WordPress admin dashboard.

In this episode we cover setting up a Timber Starter theme in our WordPress installation and extending it with Custom Post Types (CPTs).

In this video I'll be covering ACF and the WPGraphQL plug-in, and how we can raise some of the ACF fields on custom post types into the schema.

In this video, I cover how you can build your own custom Gutenberg blocks using the ACF Pro plugin and then show the block attributes in your schema.

We cover the core concepts of what Yoast SEO provides us to our schema and how we can access the Yoast SEO fields using a GraphQL query.

In this video, we get up and running with our Gatsby portion of the series. We install a starter kit for our envrionment and spin up a local dev server.

In this video, we'll be linking the WordPress schema we had developed in the previous chapter of the series into our Gatsby system.

We create a demo query which asks for information regarding our WordPress posts. With the JSON response, we then render some blog posts slugs to the page.

In this video, we will look at how we can programmatically generate pages using the createPages API that Gatsby provides us.

When working with our GraphQL schema we will often encounter the issue of having to render an HTML string as HTML elements within our React application.

In this video, we look at the Gutenberg blocks in our WordPress editor and work on a method of converting the blocks into React Components.

In this episode, we look at the Styled Components NPM package and why they are of benefit to implementing in our React application.

In this video, we import the WordPress menu data from our GraphQL schema to generate React navigation systems with the Gatsby link component.

Gatsby is rendering our homepage under route /homepage, in this video, I will correct the site to provide the homepage at the index of route of our website

By using the WPGraphQL Yoast plugin we can import the data into our Gatsby application to generate HTML head tags in our custom SEO React component.

With our Gatsby site complete, we now need to deploy it a hosting environment. Netlify is a free hosting platform which we will use to deploy to.

We want our Netlify to build every time we make a change to the content on our WordPress website. In this video, we do just that.

Forms are an important component of any website, I will show you the alternative solution using Netlify forms on your JAMStack Gatsby site.

In this video, we explore the new isFrontPage field available in our GraphQL schema as of WPGraphQL version 0.4.1. Thanks to Zac Gordon and Jason Bahl!

We separate each createPages function into asynchronous NodeJS functions which will query our internal schema and then map over the results to create pages.

In this video, we will increase the maximum queryable nodes returned by a single GraphQL query in WPGraphQL from 100 items to 300+ items.

In this video, we cover how you can enable a custom data source for you Gatsby GraphQL schema. Specifically using the YouTube and Dribbble APis.

We go into how you can register a custom taxonomy for your WordPress theme, and then expose the taxonomy within your WPGraphQL schema.

With our new WordPress Taxonomy surfacing in our WPGraphQL schema, we now go on to build our internal Gatsby GraphQL schema.