⚠️ This lesson is retired and might contain outdated information.

Build a GraphQL Query using Gatsby’s GraphiQL Explorer

Amberley Romo
InstructorAmberley Romo
Share this video with your friends

Social Share Links

Send Tweet
Published 5 years ago
Updated 2 years ago

When building Gatsby sites, you'll very likely be building GraphQL queries. graphiql-explorer is a plugin for GraphiQL that enables you to interactively explore and build GraphQL queries. It enables you to construct full queries by clicking through available fields and inputs without the repetitive process of typing these queries out by hand!

This video will teach you:

  • How to access the GraphiQL Explorer
  • How to build a query using the GraphiQL Explorer

Instructor: [00:00] In this example, gatsby-config file, we have a site title defined with the value of "Hello, World!" here in the siteMetadata object. I'm already running this Gatsby site in development mode, which provides a link to GraphiQL. I'll open that up and check out the explorer pane here on the left.

[00:17] To build a query for site title, we'll click Site, Site Metadata, and then Site Title. We'll click the Play button to execute the query. The query is returning what we want, the site title, with a value of "Hello, World!" This query is ready to copy and use in our project.

egghead
egghead

Member comments are a way for members to communicate, interact, and ask questions about a lesson.

The instructor or someone from the community might respond to your question Here are a few basic guidelines to commenting on egghead.io

Be on-Topic

Comments are for discussing a lesson. If you're having a general issue with the website functionality, please contact us at support@egghead.io.

Avoid meta-discussion

  • This was great!
  • This was horrible!
  • I didn't like this because it didn't match my skill level.
  • +1 It will likely be deleted as spam.

Code Problems?

Should be accompanied by code! Codesandbox or Stackblitz provide a way to share code and discuss it in context

Details and Context

Vague question? Vague answer. Any details and context you can provide will lure more interesting answers!

Markdown supported.
Become a member to join the discussionEnroll Today