Basic Client-Side GraphQL Tutorial For Beginners

NOTE: This tutorial focusses on the syntax laid out in the GraphQL spec to query and update your data in the Client. I’ll be publishing an article on how to write the server side part using Apollo soon, and will update this article with a link then. Apologies that it’s such a long article — it’s just that there’s so much material that we need to go through. Hope it helps! =)

I’m not going to sugar-coat it, learning the whole GraphQL “package” (syntax, implementing with Express, and finally implementing with Apollo) was difficult, painful, and time-consuming. 🔪

There are a lot of finicky little gotchas, especially when implementing in React with Apollo, and it takes time and patience until you can “effortlessly” navigate through a larger application, connect the dots, and write additional code that works, not to mention code that adheres to best practices.

And yet, all that said, it’s still worth it for two main reasons:

• Industry is gradually but surely adopting GraphQL. It’s not on par with REST yet, but it’s on the way, so if you want to keep your job and stay relevant and employable, it’s time to hit the books.
• Threats of abject poverty aside, it’s actually a good way to query and update your apps’ data, once you get used to it.