GraphQL
Agenda
-
Server Overview
-
GraphQL Requests with HTTP
-
Understanding Apollo Client
-
Incorporating the useQuery and useMutation Hooks
-
Apollo and React
-
Understanding Context
-
Creating Custom Links
-
Client-side Schemas
-
Defining Caching Behaviors
Building the
Pet Library Schema
Keep In Mind:
-
What Clients Need
-
Specific, Consistent Naming
-
Custom Objects Over Scalar Values
Code First vs Schema First
enum PetCategory
DOG
CAT
STINGRAY
RABBIT
type Pet
id: ID!
name: String!
category: PetCategory!
...
HORSE
sleepAmount: Int
curious: Boolean
favoriteFood: String
floppy: Int
good: Boolean
chill: Boolean
fast: Boolean
streetsmart: Boolean
majestic: Boolean
interface Pet
type Cat implements Pet
id: ID!
name: String
...
sleepAmount: Int
curious: Boolean
id: ID!
name: String!
weight: Float
status: PetStatus
photo: Photo
dueDate: Date
inCareOf: Customer
type Dog implements Pet
id: ID!
name: String
...
good: Boolean
type Rabbit implements Pet
id: ID!
name: String
...
favoriteFood: String
floppy: Int
type Stingray
implements Pet
id: ID!
name: String
...
chill: Boolean
fast: Boolean
type Horse
implements Pet
id: ID!
name: String
...
streetsmart: Boolean
majestic: Boolean
type *TBDFuturePet
implements Pet
id: ID!
name: String
...
newField: _____
newField: _____
Union Types
type Query {
familyPets: [FamilyPets!]!
}
union FamilyPet = Cat | Dog
Query
query {
familyPets {
__typename
...on Cat {
name
weight
}
...on Dog {
name
status
}
}
}