📄 Table of Contents

Introduction

What ?

Why?

How does GraphQL actually work

Operations in GraphQL

Examples

mutation CreateUser($name: String!){
createUser(name: $name) {
name
}
}

GraphQL Query

Comparison between REST (left) and GraphQL (right)

How GraphQL can challenge the REST:

{
hero {
name
}
}

Real-world query example

npm install react-apollo
npm install graphql-tag

Loading state

Error state

How to Convert a Traditional GraphQL Query to React Hooks

npm install @apollo/react-hooks
demonstration of a traditional query for a React class component
example is of a React functional component using Hooks.

Real-world mutation example

Conclusion

Experience with Front-end Technologies and MERN / MEAN Stack. Working on all Major UI Frameworks like React, Angular.