Building Your First GraphQL Client in JS
MongoDB Atlas GraphQL API (formerly Stitch GraphQL) has been deprecated and shut down. This tutorial will not work with current MongoDB services.

| 2 min read

Building Your First GraphQL Client in JS

TL;DR

A talk about building your first GraphQL client in JavaScript using MongoDB Atlas. The platform has since been deprecated, so this is mostly a historical reference now.

Note: This talk covered MongoDB’s GraphQL API support through Stitch/Realm, which has since been deprecated and shut down. The content is preserved here as a historical reference.

Thanks for coming to my talk, Building Your First GraphQL Client in JS. Here you will find all the resources discussed during the talk.

About

RESTful APIs have been around for a while now, but they are flawed. Things like non-standard CRUD operations, response validation, error handling, in-memory state management, etc. just get really hard. In this talk, you will learn how GraphQL – a standard that unifies server and client communication – comes to save the day, and why the surrounding tooling is a huge improvement.

We will answer the following questions. What is the philosophy behind GraphQL? How do you architect a scalable schema? How can GraphQL boost productivity? How can you avoid common pitfalls?

We will then get a GraphQL server up and running while focusing on exploring real-world patterns for architecting our schema. We will discuss and implement practical steps to improve query performance, error handling, and caching.

Source Code

JoeKarlsson/mongodb-graphql-demo on GitHub

Slides

View the slides on SpeakerDeck

Video

Talk Outline

  • Comparison of REST to GraphQL
  • Intro to GraphQL
    • Why use GraphQL?
      • Declarative
      • Decoupled from storage
      • Validated and structured
      • Facilitates Collaboration
      • Super Fast
      • Graphiql
    • Why NOT use GraphQL
      • More abstraction has greater performance costs
      • GraphQL is still very new
    • Intro to Apollo
      • Declarative Data Fetching
      • Zero-Config Caching
      • Vibrant Ecosystem
  • Live Demo
    • Setup GraphQL
    • How to do queries
    • How to do mutations
  • Final Thoughts/Recap