Skip to content

Latest commit

 

History

History
74 lines (50 loc) · 3.85 KB

introduction.md

File metadata and controls

74 lines (50 loc) · 3.85 KB
Raw
title metaTitle metaDescription
Course Introduction
Course Introduction | GraphQL React Apollo Hooks Tutorial
A powerful and concise tutorial that will introduce you to GraphQL and integrating GraphQL into your React app with Apollo, in the shortest amount of time possible.

import CommunityAuthor from '../src/CommunityAuthor.js';

GraphQL is becoming the new way to use APIs in modern web and mobile apps.

However, learning new things always takes time and without getting your hands dirty it’s very hard to understand the nuances of a new technology.

So, we put together a powerful and concise course that will introduce you to GraphQL and integrating GraphQL into your frontend stack, in the shortest amount of time possible.

We will explore the fundamentals of GraphQL and the things that make GraphQL especially suitable for modern applications, like its realtime capabilities! The course is light on opinions so that once you grok the fundamentals you can go on to choose your favorite libraries, tools and tailor your workflow.

Key topics and takeaways:

  • GraphQL vs REST
  • GraphQL queries, mutations, subscriptions
  • Setting up a GraphQL client with Apollo
  • Integrating GraphQL queries in your react app
  • Integrating GraphQL mutations with query variables to handle form input
  • Updating local state after a GraphQL mutation (form input) using Apollo cache
  • Optimistic updates to local state and UI after GraphQL mutations for a slick UX
  • Using subscriptions with subscription hooks
  • Building a real-time feed with notifications using mutations and subscriptions

What will we be building?

We will be building a realtime todo app using authenticated GraphQL APIs.

Try this deployed version of the app to see what we'll be building: https://learn-hasura-todo-app.netlify.com/

Will this course teach React concepts as well?

No, we will be simulating a scenario where we already have a GraphQL API and the basic UI of a React app built. Our task in this scenario is to integrate the GraphQL APIs into our react app to build a complete and working app.

If you're new to Hooks in React, we recommend going through the official docs and then coming back here!

What do I need to take this tutorial?

You need to have npm/yarn & node 8+ running.

How long will this tutorial take?

Less than 2 hours

Other courses

Frontend: GraphQL for: Vue, Angular, Elm, ReasonReact

Mobile: GraphQL for: React Native, iOS, Android, Flutter

Backend: Building a realtime GraphQL backend with Hasura in 30 mins (ideal for frontend, backend or fullstack developers)

About the community authors