{"tag":{"followersCount":322,"id":"57053ef1115103c3b0977fb0","logo":"https://res.cloudinary.com/hashnode/image/upload/v1467922175/sbxeze75uotah3qeqhbh.png","name":"Apollo GraphQL","postsCount":174,"slug":"apollo","tagline":"Building flexible, open-source clients and tools for GraphQL.","info":{"html":"

Apollo is an incrementally-adoptable data stack that manages the flow of data between clients and backends. Based on GraphQL, it gives you a principled, unified, and scalable API for developing modern apps on top of services.

\n","__typename":"Content"},"trending":{"edges":[{"node":{"id":"61167bd373a6cd48b7f18c3f","_id":"61167bd373a6cd48b7f18c3f","coverImage":{"isPortrait":false,"url":"https://cdn.hashnode.com/res/hashnode/image/upload/v1619861417321/3AK8NjrL0.png","__typename":"PostCoverImage"},"slug":"graphql-for-beginners-build-real-time-chat-app-with-apollo-client-and-react","readTime":8,"replyCount":7,"responseCount":9,"brief":"Welcome back to GraphQL for Beginners! A beginner-friendly series introducing the basic concepts of GraphQL and how to connect it to a front-end framework like React using Apollo. \nIn this part, we will complete our simple chat app by building our fr...","subtitle":"Beginner-friendly series on GraphQL 🔰 Let's continue our app! Part 4 Finale: Set up client-side with React and Apollo Client.","isFeatured":true,"contributors":[{"_id":"5c9bb4026656f09759cdc1f0","name":"Tapas Adhikary","photo":"https://cdn.hashnode.com/res/hashnode/image/upload/v1645464332466/IynS2q6H6.jpeg","username":"atapas","__typename":"User"},{"_id":"5d836af296a20d81186b5fc8","name":"Olubisi Idris Ayinde","photo":"https://cdn.hashnode.com/res/hashnode/image/upload/v1634512776595/ZsSMjqPor.png","username":"olanetsoft","__typename":"User"},{"_id":"5f3ca7269584ef298dc172e4","name":"Usman Sabuwala","photo":"https://cdn.hashnode.com/res/hashnode/image/upload/v1627648591642/VKg_lEi1D.jpeg","username":"usmanwrites","__typename":"User"},{"_id":"5fa172ae24a897066ab25d14","name":"Deepak Choudhary","photo":"https://cdn.hashnode.com/res/hashnode/image/upload/v1604416176139/d2w8yh9zN.jpeg","username":"Deepak2","__typename":"User"},{"_id":"60909478150acd02607141b0","name":"Yash Tiwari","photo":"https://cdn.hashnode.com/res/hashnode/image/upload/v1620714216195/dkdauIvxT.jpeg","username":"Coursesity","__typename":"User"},{"_id":"6093c2a5a7a3827bb64cdd61","name":"Insha Ramin","photo":"https://cdn.hashnode.com/res/hashnode/image/upload/v1620529987664/6flu8GBjV.jpeg","username":"Inshaweb","__typename":"User"},{"_id":"60f1565a303c5845ab8cb2aa","name":"Soham De Roy","photo":"https://cdn.hashnode.com/res/hashnode/image/upload/v1640412976057/vXG8mqXsP.jpeg","username":"sohamderoy","__typename":"User"},{"_id":"61094beb725d9303e03505f9","name":"24x7 Dev","photo":"https://cdn.hashnode.com/res/hashnode/image/upload/v1627999212091/06zbDGbjc.png","username":"24x7dev","__typename":"User"},{"_id":"615b326658a5294ce01ae1d9","name":"StepZen","photo":"https://cdn.hashnode.com/res/hashnode/image/upload/v1634051871400/bfPGG5WTf.png","username":"StepZen","__typename":"User"}],"bookmarked":false,"views":6889,"url":"https://victoria.hashnode.net/graphql-for-beginners-build-real-time-chat-app-with-apollo-client-and-react","totalReactions":152,"title":"GraphQL for Beginners: Build Real-Time Chat App with Apollo Client and React","dateAdded":"2021-08-13T14:04:03.765Z","cuid":"cksaf8law02cid3s10cmbct3o","preferences":{"disableComments":false,"__typename":"PostPreferences"},"__typename":"Post","author":{"_id":"5ebd7a2dacf8911d7951ed40","name":"Victoria Lo","photo":"https://cdn.hashnode.com/res/hashnode/image/upload/v1672984921463/25B4G5fCJ.jpg","isPro":false,"username":"victoria","__typename":"User"},"series":{"_id":"6065c83ffad5042228d35d26","slug":"graphql","name":"GraphQL for Beginners","cuid":"ckmywmdvn01twqws18u0mbav3","__typename":"Series"},"tags":[{"_id":"56744723958ef13879b9555c","logo":"https://res.cloudinary.com/hashnode/image/upload/v1475235506/qbofja8kwx8cw8nuyaqg.jpg","name":"GraphQL","slug":"graphql","__typename":"Tag"},{"_id":"56744720958ef13879b947ce","logo":"https://cdn.hashnode.com/res/hashnode/image/upload/v1607083259704/T1D1fMyyR.png","name":"Tutorial","slug":"tutorial","__typename":"Tag"},{"_id":"57053ef1115103c3b0977fb0","logo":"https://res.cloudinary.com/hashnode/image/upload/v1467922175/sbxeze75uotah3qeqhbh.png","name":"Apollo GraphQL","slug":"apollo","__typename":"Tag"},{"_id":"56744723958ef13879b95434","logo":"https://cdn.hashnode.com/res/hashnode/image/upload/v1513321478077/ByCWNxZMf.png","name":"React","slug":"reactjs","__typename":"Tag"},{"_id":"56744722958ef13879b94f1b","logo":"https://res.cloudinary.com/hashnode/image/upload/v1450469658/vdxecajl3uwbprclsctm.jpg","name":"Web Development","slug":"web-development","__typename":"Tag"}],"publication":{"_id":"5ebd7c02acf8911d7951ed49","url":"https://victoria.hashnode.net","canonicalURL":"https://victoria.hashnode.net","title":"Articles by Victoria Lo","displayTitle":"Blogging and Web Development | Articles by Victoria Lo","isHeadless":false,"favicon":"https://cdn.hashnode.com/res/hashnode/image/upload/v1672984904615/AvlfZBL8d.jpg","headerColor":"#e3e3e3","metaTags":"","isTeam":false,"domainInfo":{"hashnodeSubdomain":"victoria","domain":{"host":"lo-victoria.com","ready":true,"__typename":"DomainStatus"},"__typename":"DomainInfo"},"urlPattern":"SIMPLE","__typename":"Publication"},"comments":{"edges":[{"node":{"id":"6117104bf6ebde51f64f9c14","author":{"_id":"5f3ca7269584ef298dc172e4","name":"Usman Sabuwala","photo":"https://cdn.hashnode.com/res/hashnode/image/upload/v1627648591642/VKg_lEi1D.jpeg","isPro":false,"username":"usmanwrites","__typename":"User"},"content":{"html":"

This was the part we were all waiting for 🎉! Thank you, Victoria!

\n
Quick tip: Check out Vite once as a replacement to create-react-app. You'll love it! Just npm init vite
\n

\n","markdown":"This was the part we were all waiting for 🎉! Thank you, Victoria!\n\n> Quick tip: Check out [Vite](https://vitejs.dev) once as a replacement to `create-react-app`. You'll love it! Just `npm init vite`","text":"This was the part we were all waiting for 🎉! Thank you, Victoria!\n\nQuick tip: Check out Vite once as a replacement to create-react-app. You'll love it! Just npm init vite\n\n","__typename":"Content"},"dateAdded":"2021-08-14T00:37:31.674Z","stamp":"cksb1v82g00226us1hkaj27nn","totalReactions":2,"__typename":"Comment"},"__typename":"PostCommentEdge"}],"pageInfo":{"hasNextPage":true,"endCursor":"MQ==","__typename":"PageInfo"},"__typename":"PostCommentConnection"}},"__typename":"PostEdge"},{"node":{"id":"5fcf7ee8a38e1f208d80d555","_id":"5fcf7ee8a38e1f208d80d555","coverImage":{"isPortrait":false,"url":"https://cdn.hashnode.com/res/hashnode/image/upload/v1607433729615/L6-pE9qoq.png","__typename":"PostCoverImage"},"slug":"learn-graphql-in-7-minutes","readTime":7,"replyCount":1,"responseCount":1,"brief":"Hey there! GraphQL looks like a very complex thing but it's really not the case, in fact it eases our API development process in a defined manner. In this article we're gonna learn what GraphQL is and why is it so crucial in the way we look at APIs.\n...","subtitle":null,"isFeatured":true,"contributors":[{"_id":"5f82e67c7762251b305d9a67","name":"Manaswini","photo":"https://cdn.hashnode.com/res/hashnode/image/upload/v1602414284550/vYg-oyIW1.jpeg","username":"ParallelManu","__typename":"User"}],"bookmarked":false,"views":990,"url":"https://rovenclasher.hashnode.net/learn-graphql-in-7-minutes","totalReactions":109,"title":"Learn GraphQL in 7 minutes!","dateAdded":"2020-12-08T13:26:00.374Z","cuid":"ckig0odvn02swfhs1fdl49uhx","preferences":{"disableComments":false,"__typename":"PostPreferences"},"__typename":"Post","author":{"_id":"5f5b0ea91f75694fab53ee74","name":"Rishav Jadon","photo":"https://cdn.hashnode.com/res/hashnode/image/upload/v1610692937081/_DIOh-54E.jpeg","isPro":false,"username":"Rishav","__typename":"User"},"series":null,"tags":[{"_id":"56744723958ef13879b9555c","logo":"https://res.cloudinary.com/hashnode/image/upload/v1475235506/qbofja8kwx8cw8nuyaqg.jpg","name":"GraphQL","slug":"graphql","__typename":"Tag"},{"_id":"56b1208d04f0061506b360ff","logo":null,"name":"REST API","slug":"rest-api","__typename":"Tag"},{"_id":"56744723958ef13879b95245","logo":"https://res.cloudinary.com/hashnode/image/upload/v1450468334/jirjz7cc54l2mstzpaab.png","name":"APIs","slug":"apis","__typename":"Tag"},{"_id":"56744722958ef13879b950bd","logo":null,"name":"backend","slug":"backend","__typename":"Tag"},{"_id":"57053ef1115103c3b0977fb0","logo":"https://res.cloudinary.com/hashnode/image/upload/v1467922175/sbxeze75uotah3qeqhbh.png","name":"Apollo GraphQL","slug":"apollo","__typename":"Tag"}],"publication":{"_id":"5fc4dfff0a072175ef2cf1e4","url":"https://rovenclasher.hashnode.net","canonicalURL":"https://rovenclasher.hashnode.net","title":"Rishav's Blog","displayTitle":null,"isHeadless":false,"favicon":null,"headerColor":"#ffffff","metaTags":null,"isTeam":false,"domainInfo":{"hashnodeSubdomain":"rovenclasher","domain":null,"__typename":"DomainInfo"},"urlPattern":"SIMPLE","__typename":"Publication"},"comments":{"edges":[{"node":{"id":"5fcf8beda38e1f208d80d65d","author":{"_id":"5f82e67c7762251b305d9a67","name":"Manaswini","photo":"https://cdn.hashnode.com/res/hashnode/image/upload/v1602414284550/vYg-oyIW1.jpeg","isPro":false,"username":"ParallelManu","__typename":"User"},"content":{"html":"

Woah Rishav! This was very well written!

\n","markdown":"Woah Rishav! This was very well written!","text":"Woah Rishav! This was very well written!\n","__typename":"Content"},"dateAdded":"2020-12-08T14:21:33.995Z","stamp":"ckig2nu09036ffhs1hb6k7e6x","totalReactions":1,"__typename":"Comment"},"__typename":"PostCommentEdge"}],"pageInfo":{"hasNextPage":false,"endCursor":"MQ==","__typename":"PageInfo"},"__typename":"PostCommentConnection"}},"__typename":"PostEdge"},{"node":{"id":"62da9141e3738c59b0b7b79e","_id":"62da9141e3738c59b0b7b79e","coverImage":{"isPortrait":false,"url":"https://cdn.hashnode.com/res/hashnode/image/upload/v1657953180048/PE1i6UONf.png","__typename":"PostCoverImage"},"slug":"how-to-use-graphql-in-react-native","readTime":5,"replyCount":0,"responseCount":0,"brief":"Welcome to another GraphQL for Beginners article, a series dedicated to help any developer get familiar with GraphQL.\nIn this article, let's look at how to setup, integrate and fetch data from a GraphQL API in a React Native app.\nPrerequisites\nBefor...","subtitle":"How do you work with GraphQL in React Native? Here's a step-by-step tutorial to get you started!","isFeatured":false,"contributors":[],"bookmarked":false,"views":7643,"url":"https://victoria.hashnode.net/how-to-use-graphql-in-react-native","totalReactions":77,"title":"How to use GraphQL in React Native","dateAdded":"2022-07-22T12:00:01.060Z","cuid":"cl5weu90m07jvisnveiwuhva3","preferences":{"disableComments":false,"__typename":"PostPreferences"},"__typename":"Post","author":{"_id":"5ebd7a2dacf8911d7951ed40","name":"Victoria Lo","photo":"https://cdn.hashnode.com/res/hashnode/image/upload/v1672984921463/25B4G5fCJ.jpg","isPro":false,"username":"victoria","__typename":"User"},"series":{"_id":"6065c83ffad5042228d35d26","slug":"graphql","name":"GraphQL for Beginners","cuid":"ckmywmdvn01twqws18u0mbav3","__typename":"Series"},"tags":[{"_id":"56744723958ef13879b9555c","logo":"https://res.cloudinary.com/hashnode/image/upload/v1475235506/qbofja8kwx8cw8nuyaqg.jpg","name":"GraphQL","slug":"graphql","__typename":"Tag"},{"_id":"57053ef1115103c3b0977fb0","logo":"https://res.cloudinary.com/hashnode/image/upload/v1467922175/sbxeze75uotah3qeqhbh.png","name":"Apollo GraphQL","slug":"apollo","__typename":"Tag"},{"_id":"56744722958ef13879b94f4d","logo":"https://res.cloudinary.com/hashnode/image/upload/v1475235386/rkij45wit50lfpkbte5q.jpg","name":"React Native","slug":"react-native","__typename":"Tag"},{"_id":"56744720958ef13879b947ce","logo":"https://cdn.hashnode.com/res/hashnode/image/upload/v1607083259704/T1D1fMyyR.png","name":"Tutorial","slug":"tutorial","__typename":"Tag"},{"_id":"56a399f292921b8f79d3633c","logo":null,"name":"Frontend Development","slug":"frontend-development","__typename":"Tag"}],"publication":{"_id":"5ebd7c02acf8911d7951ed49","url":"https://victoria.hashnode.net","canonicalURL":"https://victoria.hashnode.net","title":"Articles by Victoria Lo","displayTitle":"Blogging and Web Development | Articles by Victoria Lo","isHeadless":false,"favicon":"https://cdn.hashnode.com/res/hashnode/image/upload/v1672984904615/AvlfZBL8d.jpg","headerColor":"#e3e3e3","metaTags":"","isTeam":false,"domainInfo":{"hashnodeSubdomain":"victoria","domain":{"host":"lo-victoria.com","ready":true,"__typename":"DomainStatus"},"__typename":"DomainInfo"},"urlPattern":"SIMPLE","__typename":"Publication"},"comments":{"edges":[],"pageInfo":{"hasNextPage":false,"endCursor":null,"__typename":"PageInfo"},"__typename":"PostCommentConnection"}},"__typename":"PostEdge"}],"__typename":"FeedPostConnection"},"__typename":"Tag"}}

GraphQL for Beginners: Build Real-Time Chat App with Apollo Client and React

Learn GraphQL in 7 minutes!

How to use GraphQL in React Native

Using the Rick and Morty API with GraphQL and React JS.

How to Write a GraphQL Query

Mercurius and Apollo Interoperability

How I Used GraphQL to Build a Smarter Chatbot for Customer Support

Take your Next js + GraphQL + TypeScript Setup to the next level

Build a GraphQL API with NestJs and MongoDB, in a modern way - Part 1.

Mocking GraphQL response for React components using MockedProvider

GraphQL's @defer and @stream Directives are overkill

Inheritance in GraphQL: When and how to use it

GraphQL for Beginners: Implementing a Robust Payment System