loading...
Cover image for GraphQL vs REST - a vending machine example
GraphQL Editor

GraphQL vs REST - a vending machine example

tomekponiat profile image Tomek Poniatowicz Originally published at blog.graphqleditor.com Updated on ・2 min read

Any "The Office" fans here?

Do you remember the episode in which Jim put Dwight's stuff into a vending machine? This seems to an on-point example of the major difference between GraphQL vs REST according to one of the GraphQL’s creators - Lee Byron.

The Office - vending machine prank

The Vending Machine Case

In that episode, Jim puts Dwight's belongings into a vending machine. Among them where coffee mug, bobble-head, nameplate, pencil cup ... and Dwight's wallet. Not to leave him empty-handed, Jim provided Dwight a bag of nickels.

To retrieve his item from a vending machine Dwight should:

  1. Use nickles to retrieve his wallet
  2. Use quartes, halves to retrieve the first object
  3. Repeat the procedure for every item he wants to retrieve

That's the way the vending machine operates. The pattern is similar to those we know from using the REST API. Imagine we want to retrieve posts from a company blog using rest:
GET /api/posts
and if you want to add authors you will need to fetch the from another resource (or modify your resource containing posts) you'll end up with two server requests instead of one (or extra work), and as you continue to scale, you may have even more requests to different endpoints in order to fetch all the needed data:
GET /api/post/:id
This is exactly our vending machine, where to get one item you need to press one button. If you want to get more items you need to get the one-by-one, repeating the procedure for different items.

A vending machine with special buttons

Now imagine a vending machine with special buttons allowing you to get multiple things at once. This kind of super vending would help Dwight's get his stuff back super fast and it's exactly what GraphQL API does in terms of retrieving data.
GraphQL Query
In GraphQL we have a single endpoint being able to process complex requests. You query the GraphQL server for specific data and it will respond with what was requested, which results in fewer bits transferred over the wire.

GraphQL vs REST

Speed up your GraphQL API development

GraphQL Editor is a supportive tool for both advanced GraphQL users as well as those taking their first steps with GraphQL APIs. Our all-in-one development environment for GraphQL will help you build, manage & deploy your GraphQL API much faster thanks to dozens of built-in micro features.

GraphQL Editor

Discussion

pic
Editor guide
Collapse
timolesanmann profile image
Tim-Ole Sanmann

Wow, I think, I've never seen such a symbolic and an easy understandable description of GraphQL before. I never thought about learning how to use it. But now it sounds to me like the next thing I'd like to get into.

Great Work! Thank you!

Can you recommend any tutorial, course, video or lecture for getting started? Maybe some tutorial you created?

Tim

Collapse
tomekponiat profile image
Tomek Poniatowicz Author

Thanks Tim!
You should try out Interactive Tutorial embedded in GraphQL Editor - app.graphqleditor.com/?category=tu...

As well as this post - dev.to/graphqleditor/graphql-resou...

As it gathers many GraphQL related resources :)

Collapse
timolesanmann profile image
Tim-Ole Sanmann

Many thanks for the Link to the page! Can't wait to come home and getting startet! :)

Collapse
simo97 profile image
ADONIS SIMO

yes am really happy with this description too...

Collapse
thandy1212 profile image
Taylor Handy

This is a bit nitpicking, but your REST example is actually an RPC example. It's not REST unless it adheres to HATEOAS

Collapse
calinbolea profile image
Calin Bolea

meh, it can also be level 1 or 2 of the Richardson Maturity Model.

Collapse
vanto profile image
Collapse
tundeajibawo profile image
Collapse
acsbendi profile image
Bendegúz Ács

What do you mean by that? Should there be a "links" field for every post in the example response?

Collapse
fly profile image
joon

Brilliant, almost immaculate analogy. I was already hooked to graphQL the first time I was introduced to it, now I'm hyped.
Unicorn for the office reference :)

Beautiful concise post. Very on point and informative.

Collapse
marais profile image
Marais Rossouw

Pretty cool tool mate! Must say though, I have a hard time making sense of what I'm seeing. i imported my schema, which is some 80k lines, and its just boxes! One thing though, would be cool to wrap deprecation warnings. So its labels don't fly halfway across the screen!

Collapse
aexol profile image
Artur Czemiel

Wow, such a big schema, maybe you can break it to smaller pieces using our GraphQL Libraries feature? What would you like to improve else? Have you tried using schema explorer to navigate it?

We take user feedback seriously so feel free to reach us via intercom or email or slack

Collapse
awakeel profile image
Abdul wakeel

The vending machine is example is good in this case, but what if I have two thousand different schemas(table) For each schema I will have to create graphql endpoint? Or is there any way to create a generic endpoint for All table schemes?

Collapse
cassiamani profile image