Create your Bedrock application:

composer create-project roots/bedrock wordpress-bedrock

Create a new database for your app and configure it inside of your wordpress-bedrock/.env file.

Then, visit your new local WordPress application instance via:

http://wordpress-bedrock.test

Setup your administrator username and password, and you will be brought to the WordPress admin dashboard.

Setup your Bedrock application for GraphQL:

Install the WPGraphQL package by running the following in the root directory:

composer require wp-graphql/wp-graphql

Then, enable the plugin in your WordPress admin dashboard.

Navigate to the newly visible GraphQL Settings page on your WordPress dashboard, click the GraphQL endpoint link shown (i.e. http://wordpress-bedrock.test/wp/graphql). You should see the following error:

Warning: require(/Users/stevebauman/Sites/Work/wordpress-bedrock/web/wp/graphql): failed to open stream: No such file or directory in /Users/stevebauman/.composer/vendor/laravel/valet/server.php on line 191

Fatal error: require(): Failed opening required '/Users/stevebauman/Sites/Work/wordpress-bedrock/web/wp/graphql' (include_path='.:/usr/local/Cellar/php/7.4.6_1/share/php/pear') in /Users/stevebauman/.composer/vendor/laravel/valet/server.php on line 191

Laravel supporting local application drivers really save us here.

Let's create one in the root directory of our WordPress application:

<?php

// wordpress-bedrock/LocalValetDriver.php

class LocalValetDriver extends LaravelValetDriver
{
    public function serves($sitePath, $siteName, $uri)
    {
        return $uri === "/wp/graphql";
    }
    
    public function frontControllerPath($sitePath, $siteName, $uri)
    {
        return $sitePath.'/web/index.php';
    }
}

Now visit the same WPGraphQL endpoint and you should see a different error in JSON:

This means it's working.

We're almost there. Install the below composer package into your Bedrock application:

composer require gatsbyjs/wp-gatsby

Setup your Gatsby application:

On your Gatsby application, install the following npm packages:

gatsby-plugin-sharp
gatsby-transformer-sharp
gatsby-source-wordpress-experimental

Then, configure the your WordPress endpoint:

{
    resolve: `gatsby-source-wordpress-experimental`,
    options: {
    	url: `http://wordpress-bedrock.test/wp/graphql`,
    },
},

Build your application using npm run develop, open up your Gatsby GraphQL dashboard and you should now see all of your WordPress content available in Gatsby!