No history yet

Introduction to GraphQL

Asking for Exactly What You Need

Imagine you’re at a restaurant. With most ordering systems, you might ask for the “Daily Special,” and you get a burger, fries, and a soda. But what if you only wanted the burger? You still get the whole meal and have to pick out what you don't want. This is how many traditional APIs work. You request information from an endpoint, and it sends back a fixed structure of data, whether you need all of it or not.

GraphQL changes the game. It’s like telling the waiter, “I'd like the burger patty from the Daily Special, a side of pickles, and a glass of water.” You get exactly what you asked for, nothing more, nothing less. This precision is the core idea behind GraphQL.

GraphQL is a query language for APIs that gives clients the power to request exactly the data they need, nothing more, nothing less.

Developed by Facebook in 2012 to power its mobile apps and open-sourced in 2015, GraphQL was born out of the need to be more efficient with data. Mobile networks can be slow, and sending unnecessary information wastes bandwidth and drains battery. GraphQL solves two common problems at once:

  • Over-fetching: This happens when the server sends more data than the client needs. Think of getting a user's entire profile when you only needed their name. It’s wasteful.
  • Under-fetching: This is the opposite problem. The endpoint doesn’t provide enough information, forcing you to make multiple requests to get all the data you need. For example, first you fetch the user, then you make another request to get their list of friends. Each trip to the server adds delay.

The Building Blocks

GraphQL organizes an API around a few key concepts. Together, they create a clear and powerful way for client applications to talk to a server.

Schema The schema is the foundation of a GraphQL API. It’s a contract between the client and the server that defines what data can be requested. The schema lists all the available data types and the relationships between them. Because it's strongly typed, there's no ambiguity; you know exactly what kind of data to expect, whether it's a string, a number, or a custom object like a Product.

Lesson image

Queries This is how you fetch data. A GraphQL query isn't just a request for a resource; it's a detailed description of the data you want. You structure your query to look just like the JSON data you want to receive. This declarative approach makes it incredibly easy to understand what information a query will return.

// Request: Get a specific film's title and director
{
  film(filmID: 1) {
    title
    director
  }
}

The server would respond with a JSON object that matches the query's structure perfectly:

{
  "data": {
    "film": {
      "title": "A New Hope",
      "director": "George Lucas"
    }
  }
}

Mutations While queries are for reading data, mutations are for writing it. This includes creating, updating, or deleting data. By explicitly using the mutation keyword, it's always clear when an operation is causing a change on the server.

// Mutation: Add a review for a movie
mutation {
  createReview(episode: EMPIRE, review: {
    stars: 5,
    commentary: "This is a great movie!"
  }) {
    stars
    commentary
  }
}

Subscriptions Subscriptions are a way to maintain a live connection to the server, allowing it to push real-time updates to the client. When a specific event happens on the server, it automatically sends the relevant data to any clients that are subscribed. This is useful for things like chat applications, live notifications, or financial tickers.

Time to check what you've learned.

Quiz Questions 1/5

What is 'over-fetching' in the context of traditional APIs?

Quiz Questions 2/5

Your team is building a live-updating news feed where new stories should appear instantly. Which GraphQL feature is best suited for this task?

By giving clients the power to ask for specific data, GraphQL creates a more efficient and predictable way to build applications.