GraphQL Introspection ❤️ 🚀

GraphQL has many superpowers that's putting REST to rest nowadays. With its increase in popularity, adoption, and all the other great things GraphQL has to offer. Developer Experience and the ability to introspect the GraphQL Schema in real-time is just fascinating but sometimes overlooked.

Introspection

This is a powerful tool! It allows you to query your latest GraphQL Schema without writing any Front-End code in real-time. It will validate the query, mutation, or subscription against the running GraphQL Schema before it even hits the server layer, otherwise known as Schema Validation.

For Front-End engineers trying to investigate what fields the Schema has to offer is easy. Therefore, eliminating needless slack conversations that go on forever with the backend engineer, or taking a deep dive into the rabbit hole on what the REST API is going to return. Productivity and efficiency increase ten-fold when we have a tool such as GraphQL at our disposal.

Ohh, and not to mention, the exact shape of the query that was sent to the server will be in the same shape as the response. In addition, since GraphQL Schemas are Type Static, we can make some predictions when writing our Front-End code based on the type of fields that are going to be returned.

{
  me {
     id
     firstName
     lastName
  }
}

{
  "me": {
     "id": 1,
     "firstName": "Herny",
     "lastName": "Arbolaez",
  }
}

But wait, there’s more!! Not only do developers have the power of inspection, Product teams, Analytics, and other teams trying to get data on a specific product need can query against the latest graphQL schema. Also, the product team can now collaborate with engineers to design the products, through the GraphQL Schema before writing new features.

We're going to do the introspection, using this GraphQL server setup with an example of the
Star Wars Schema API.

When you open the GraphQL playground by clicking on the DOCS button on the right side of the playground, you will be presented with the latest schema and the different types of queries/mutations you can execute against the API. This DOCS is built-in into GraphQL with ZERO configuration, which is just amazing!!

You can start with the queries below on the left panel and start introspecting the graph. i.e.:

# 1. How many episodes did 'Luke Skywalker' appear in?
{
  human(id: 1000) {
    id
    name
    appearsIn // a collection of the episodes that he appear
  }
}

# 2. What starships 'Luke Skywalker' had?
{
  human(id: 1000) {
    id
    name
    appearsIn
    starships { // a collection of he's starships
       id
       name
    }
  }
}

# 3. How many friends did 'Luke Skywalker' had?
{
  human(id: 1000) {
    id
    name
    appearsIn
    starships { // a collection of he's starships
      id
      name
    }
    friends { // Luke's friends
      id
      name
    }
  }
}

After introspecting the schema, we were able to answer those three different questions, all through the GraphQL Playground. Now product teams, stakeholders, and engineers can collect feedback on a new feature on the real-time schema and make their final decisions.