GraphQL (Facebook) (2015)

Tool: Apollo GraphQL

Table of Contents

• Before: REST API
  • 2 Problems
    • 1. Overfetching
    • 2. Underfetching
• Core Concepts of GQL
  • 1) Schema
  • 2) Query
  • 3) Resolver
  • 4) Mutation
  • 5) Subscription
• Flow
• RestAPI
  • Developer Benefits
• Summary

Before: REST API

2 Problems

1. Overfetching

• really want username
• but got user obj.

For much data → slow

2. Underfetching

• want user + its posts + comments
• but need 3 API hits for this.

[Null problem]

Too many trips.

Core Concepts of GQL

1) Schema

• contract b/w client and server.
• define every type of data that exists.
• blueprint.

2) Query

• how client reads data.
• server responds in the shape.

Example:

query {
  user(id: "42") {
    id
    name
  }
}

3) Resolver

• function that fetches data for any specific field.

Example:

const resolver = {
  Query: {
    user: (_, { id }) =>
      db.users.findById(id)
  },

  User: {
    posts: (user) =>
      db.posts.find(user.id)
  }
}

4) Mutation

• how you write data → create, update, delete.
• like query, but changing data on db.

5) Subscription

• client subscribe to an event.
• like websocket but in GQL.

Flow

Client
(send query)
(HTTP POST)
        ↓
Parse
(query string → AST)
        ↓
Validate
(schema check)
        ↓
Execute (Resolvers)
        ↓
Data layer
(DB, RestAPI, Cache...)
        ↓
Response
(JSON with data)

RestAPI

• Representational State Transfer
• bridge b/w client & server.
• uses HTTP methods → to perform CRUD operations.

Developer Benefits

Because the schema is explicitly defined upfront:

• Tooling can provide autocompletion for writing queries (e.g., in GraphiQL, Insomnia, Postman).
• The API is self-documenting — developers can explore available types and fields directly.
• It's easier to discover and consume the API without extensive external documentation.

Summary

Notes taken from a GraphQL introductory video.