March 30, 2021

Learn GraphQL – Tutorials for Fullstack GraphQL

Khalil Stemmler

Khalil Stemmler

GraphQL lets front-end developers simplify their data-fetching and state management approaches. For backend developers, GraphQL acts as a structured, maintainable API. To learn how GraphQL works across the stack, I recommend completing a fullstack GraphQL tutorial.

In this short post, I’d like to share two GraphQL training resources that we created @ Apollo to help you ramp up and get comfortable building GraphQL applications from back to front.

📽️ [Watch] Learn GraphQL – The lift-off series on Odyssey: the Apollo Course Platform

Earlier this year, we released Odyssey: the Apollo course platform. We wanted to create a more directed, interactive, and fun learning experience for developers in search of practical training using GraphQL and Apollo.

The first series of courses on Odyssey is called Lift-off.

What you’ll build

In Lift-off, you’ll build a full-stack GraphQL example application called Catstronauts, a learning platform for adventurous cats who want to explore the universe!

It contains list-view and detail-view pages of all the different courses.


In Lift-off part I, you’ll learn the core components of a full-stack GraphQL app, specifically:

  • a schema first-approach to building web applications with GraphQL
  • GraphQL’s Schema Definition Language (SDL)
  • how to set up Apollo Server, test, and develop it using Apollo Explorer
  • how to connect to your GraphQL API from the front-end using Apollo Client and React

And in the second part of the series, you’ll learn:

  • how to write more advanced queries and display data in the UI
  • how to use variables
  • how to mutate data and update the UI

Get started

Ready to start? Head on over to

📖 [Read] Learn GraphQL – The Official Apollo Full-stack GraphQL Tutorial

For those that prefer the written approach to learning, I recommend checking out the Official Apollo Full-stack GraphQL Tutorial via the Apollo docs.

What you’ll build

In the written GraphQL tutorial, we build Space Explorer: an interactive app for reserving a seat on an upcoming SpaceX launch 🚀.

It contains a login page, list and detail-view pages, user profiles, and a cart for setting up launches.


You’ll learn how to build a full-stack GraphQL application with authentication, pagination, state management, and more. Specifically, you’ll learn:

  • How to build a GraphQL schema using Apollo Server, hook it to data, and then connect to it from a client-side React applications using Apollo Client
  • How to use Apollo Client and React to fetch and display GraphQL data
  • How to use Apollo Server to build a GraphQL API
  • How to source data from a REST API
  • How to source data from a database

Get started

If you’re ready to walk through and build Space Explorer, check out the tutorial via the Apollo docs here.


There you have it — two great GraphQL tutorials to learn how to build fullstack apps.

Written by

Khalil Stemmler

Khalil Stemmler

Read more by Khalil Stemmler