Welcome to part-3 of the series. Now, we will use the graphql in our code. But first let’s remove all the boiler-plate code from our gatsby default starter.

So, open the index.js file inside the pages folder and update it as below. Notice that we are using the graphql query from the previous part here.

index.js

Rest of the chapter is exclusive content and is from my book Foundation Gatsby Projects.

The book can be purchased from Apress site here

Now, both of our pages will be shown once we click on the respective Comment link. Also notice that each will get a different /recipe/id

Page 1

Page 2

This completes part-3 of the series.

You can find the code for the same in this github repo.