GraphQL with React Tutorial (Apollo Client): Build a Rick and Morty App | Crash Course

Learn how to build GraphQL apps with React and Apollo. In this GraphQL React tutorial, we'll learn about queries and mutations, how to use GraphQL in React apps, and how to work with GraphQL in WebStorm. We're going to build a Rick and Morty Character app.

Outline

- 00:00:00 - Intro
- 00:00:24 - Explaining GraphQL and what we'll be building
- 00:07:24 - Understanding GraphQL Queries and Mutations
- 00:11:13 - Setting up our React app
- 00:15:44 - Setting up GraphQL in WebStorm
- 00:19:31 - Setting up GraphQL in our React app
- 00:21:33 - Making our first React+GraphQL query with the Apollo client
- 00:26:01 - Making GraphQL queries in WebStorm scratch files
- 00:29:08 - Using the Apollo provider in our React-GraphQL app
- 00:29:51 - Querying our GraphQL API inside the App component [1]
- 00:36:07 - Creating our Card component [1]
- 00:37:25 - Querying our GraphQL API inside the App component [2]
- 00:40:23 - Creating our Card component [2]
- 00:44:03 - Querying our GraphQL API with arguments
- 00:49:17 - Wrapping up

#webdevelopment #softwareengineering #programming #softwaredevelopment

[akirahattori]

Great tutorial Ebnezer!
I got my heads around how to connect GraphQL and React! Thank you for awesome video!

[karelabiyoga]

How to make fetchmore pagination? when i click button next the result is charaters page number 2, 3, 4, 5...
And wheh i click button prev back to characters list before

[Sammy]

Nice tutorials @Ebenezer.
I noticed the cool CLI tool/terminal window you used in the tutorial at the part when you created the react application (11:18) and I like it. What is the name and where can I download it from? Also, can it run on windows as I am not a mac user? Thanks.

[adebiyivictor]

Great job Ebenezer
Can we get an angular, bootstrap for an invoice app