1
Query Multiple Services with OneGraph GraphiQL Editor
1m 9s
2
Query Multiple Services with urqls GraphQL Client in React
4m 23s
3
Refactor Commonly Used Variables Into a Utils File to Be Shared Across Our React App
1m 14s
4
Write an Authenticated GraphQL Query in OneGraph
4m 41s
5
Install and Create an OneGraph Authentication Object Within a React Application
39s
6
Create an AuthProvider Component for Our React Application to Use Through React Context
2m 20s
7
Wrap Our React Application in an AuthProvider Component
2m 41s
8
Query Github Comments with OneGraph through urql's Client in React
4m 25s
9
Pass Authorization Headers to Our Requests in React Through urql's fetchOptions
1m 10s
10
Display GraphQL Data with a React Component
1m 46s
11
Style a React List Component
3m 36s
12
Use a GraphQL Mutation to Create a Github Issue Comment
3m 45s
13
Use urqls useMutation to Create Github Issues in a React App
7m 28s
14
Style a React Input Component with CSS-in-JS
7m 29s
15
Write a GraphQL Subscription Query in the Graphiql Editor
1m 45s
16
Extract a React View Component From a CommentQuery Component
3m 12s
17
Write a Subscription GraphQL Query in React with urql
5m 46s
18
Reduce a GraphQL Subscription Stream into a Collection with urql
3m 22s
19
Display GraphQL Subscription Results in a React UI
2m 48s
20
Use a GraphQL Query and Subscription Together to Fetch the History and Current Comments
7m 55s

Display GraphQL Data with a React Component

GraphQL>=15.0.0

Share this video with your friends

We take the data from our useQuery result and display it in an unordered list element.

We need to make sure to return a loading indicator when result.data is undefined. When result.data is truthy, we know that the GraphQL request has returned the data we asked for.

Display GraphQL Data with a React Component

Share this video with your friends

Course

React Real-Time Messaging with GraphQL using urql and OneGraph