Introduction

• GraphQL is a query language for your API

• A GraphQL service is created by defining types and fields on those types, then providing functions for each field on each type

• field

    {
      hero {
        name
      }
    }

• arguments

    {
      hero(id: '10') {
        name
        height(unit: FOOT)
      }
    }

• aliases

    {
      empireHero: hero(episode: EMPIRE) {
        name
      }
      jediHero: hero(episode: JEDI) {
        name
      }
    }

• fragments

  {
    leftComparison: hero(episode: EMPIRE) {
      ...comparisonFields
    }
    rightComparison: hero(episode: JEDI) {
      ...comparisonFields
    }
  
  }
  
  fragment comparisonFields on Character {
    name
    appearsIn
    friends {
      name
    }
  }

• Fragment with variable

  query HeroComparison($first: Int = 3) {
    leftComparison: hero(episode: EMPIRE) {
      ...comparisonFields
    }
    rightComparison: hero(episode: JEDI) {
      ...comparisonFields
    }
  
  }
  
  fragment comparisonFields on Character {
    name
    friendsConnection(first: $first) {
      totalCount
      edges {
        node {
          name
        }
      }
    }
  }

• Operation

  Syntax: [operation type] [operation name] { }

  Operation type:

  • query: fetching data

  • mutation: modify server-side data

  • subcription: stream data

• Directives

  query Hero($episode: Episode, $withFriends: Boolean!) {
    hero(episode: $episode) {
      name
      friends @include(if: $withFriends) {
        name
      }
    }
  }

  {
    "episode": "JEDI",
    "withFriends": true
  }

References

• https://graphql.org/learn/