A guide for building a production-quality React and GraphQL application.

apollohandbook.tar.gz

client

tmux-server-client

tmux-server-wait-codegen-public-runapp

tmux-server-wait-codegen-tsc-runapp

tmux-server-wait-codegen-tsc

server

Apollo Client is a popular library in JavaScript which is integrated with React applications to fetch and manage local and remote data with GraphQL. It is a comprehensive state management library, managing the state automatically with minimal code.

In this course, you’ll learn to integrate React applications with a GraphQL server. The course uses Apollo with React applications to query a GraphQL server. You will learn how to use the GraphQL Code Generator to generate TypeScript code that you can use in a React application to query and use GraphQL data in a standardized manner. You will learn how to generate lazy queries and use union types. By the end, you will also learn about mutations and their executions.

This course will help you gain working knowledge of data fetching, caching, and managing with the help of Apollo Client. To further your skills, you may use Apollo Client to integrate with Angular, Vue, Solid, Svelte and other JavaScript frameworks.

Integrating Apollo Client with React Applications

They enable returning multiple types from a union of types.

They enable returning one type from a union of types.

They enable returning one of multiple types.

Inside the generated function that executes the query via `useQuery`.

Where is the `...on` syntax used when working with union types?

Where is the <code>...on</code> syntax used when working with union types?

To handle cases for different types that return when querying a union type.

To pick fields for a type that may be returned by querying a union type.

To choose different sets of fields to return for all types in a union of a union type.

For what purpose can `...on` be used with union types?

For what purpose can <code>...on</code> be used with union types?

(True or False)Types generated by GraphQL Code Generator for union types handle cases for different returned types and can be used for rendering without further handling.


(True or False)Types generated by GraphQL Code Generator for union types handle cases for different returned types and can be used for rendering without further handling.

To extract various fields from different union types to create a new type

To extract fields for a type and create a new type

To extract one of the multiple types in a union type and create a new type

The Extract feature of TypeScript can be used for what purpose?


The Extract feature of TypeScript can be used for what purpose?

Introduction

Introducing Apollo Client

Automatically Generated Types

Lazy Queries

Union Types

Mutations

Conclusion

Appendix

Quiz About Union Types