GraphQL Tutorial #7 - GraphQL Schema

Net Ninja · Beginner ·🔧 Backend Engineering ·8y ago

Key Takeaways

The video tutorial covers creating a GraphQL schema, defining object types, and understanding the relationships between them, using the GraphQL package and ES6 destructuring to define a Book object type with fields such as ID, name, and genre.

Full Transcript

so then we know we have to make a schema to describe how the date on our graph will look so let's make that schema now inside server I'll make a new folder and I'm gonna call this said schema and inside that will create a file and we're also going to call this schema Jas all right so the first thing we need to do inside this file is require graph QL that's the main graph QL package we installed in the last video so we'll say Const graph QL is equal to require and then graph queue up all right so in this file is where we're going to define our schema remember our schema will describe the data on this kind of graph it describes the object types the relations between those object types and it describes how we can reach into the graph to interact with that data whether that be to query it and retrieve data or to mutate or change the data so either way we're jumping into this graph to interact with it right so we'll start off by inside this schema describing the object types we want on our graph so the graph right here is going to have two object types on it books and authors so ultimately we need to describe these two object types in the schema file and the relationship between them and also how to query these object types to get data buck so we're just going to start off with one object type to begin with the book so the way we define object types in graph QL is a little bit unusual at first what we need to do is we need to grab something from this graph cue our package to do it so I'm gonna say Const and I'm going to use a bit of es6 destructor in here which allows us to grab a variables out of something else so I'm going to require or not require destructor graph QL object type and pay attention to the capitalization here capital ql o and c alright that's really important so I'll set that equal their graph QL so this D structure and what it's going to do is grab this variable of this function for us from this thing right here from this package we're taking it out and storing it now so we can use this inside this file alright so once we've done that we can now define a new type so we'll call this type a book type and we'll set this equal to a new grass ql object type alright so that's the thing we've just grabbed right here so this right here is a function which takes in a object and this object is going to define what this book type is all about so first of all we'll give this a name I'm going to call it book and then we need to also define the fields on this object type so remember the fields are going to be things like a name property genre an ID that kind of thing so this fields property is actually going to be a function so we'll do our parentheses and then an arrow then another parenthesis and then an object inside that now the reason this needs to be a function is because later on when we have multiple types and they have references to one another then unless we wrap those fields in a function one type might not necessarily know what I know the type is does that make sense it might not a minute but later on when we introduce all the types as well I'll explain this a little bit more and why we need it and I'll show you what happens if we don't wrap it in a function all right so this right here this function is going to turn this object and we need to define our different fields inside here so first of all the ID the ID is going to be maybe a string of random numbers or something like that so when we're defining these fields we need to say what type is is it a string is he an integer or some other type so we'll open up an object and we're going to say the type is going to be something now we can't just do string again this is one of the nuances of graph QL we have to use a special string a graph QL string in order for it to understand the type so again we're going to grab that from graph QL by doing a comma and then saying graph QL string so again with destructor in here and we're grabbing this thing from this package as well so now we have access to this in this file so the type of this ID is going to be a graph QL string all right so a string of seemingly random numbers or something like that so that's one field that we're gonna have on each book what is another field the name of the book so again we need to define a type for this and it will be a string again so we'll say graph keep our string for this and then finally we'll have a genre property and again this will be of type string so we'll say graph QL string for that one as well so right now what we've done is we've defined our first object type on this graph and it's a book type it's called book and it has these fields right here an ID name and genre and that all of type graph QR string this is graph QL saying okay I'm expecting a string for this type and this type and this type okay so all three of them and we've wrapped all of those fields inside a function and es6 function which is returning this object and again that's because when we have multiple types later on this is going to help overcome any kind of reference errors all right and we'll explore that a little bit more when we have multiple types so this book type here is a first step in defining our our graph we'll look we've said that on a graph we're going to have this object type which is a book right but this is just one part of our schema based on this diagram down here remember we have other things in here an author type we also have these connections between the different objects and we have these entry points as well where we jump into the graph so this thing right here is a good first step but it is just the first step in defining our whole ski remember ultimately we want to pass all of this schema into this thing right here all right so we've started to define this in the next tutorial what we're going to do is we're going to look at our entry points into the graph so that we can query this data these are called rip queries and we'll take a look at those in the very next tutorial

Original Description

Hey all, in this GraphQL tutorial, I'll explain exactly what a GraphQL schema ias and we we need to create one. We'll also start to flesh out an object type (Book) inside the schema file. DONATE :) - https://www.paypal.me/thenetninja ----- COURSE LINKS: + Course files - https://github.com/iamshaunjp/graphql-playlist + Atom editor - https://atom.io/a + CMDER - http://cmder.net/ + Node Download - https://nodejs.org/en/ ======== Other Tutorials ========= ----- NODE.JS TUTORIALS https://www.youtube.com/playlist?list=PL4cUxeGkcC9gcy9lrvMJ75z9maRw4byYp ----- MONGODB TUTORIALS https://www.youtube.com/playlist?list=PL4cUxeGkcC9jpvoYriLI0bY8DOgWZfi6u ----- REACT TUTORIALS https://www.youtube.com/playlist?list=PL4cUxeGkcC9i0_2FF-WhtRIfIJ1lXlTZR ----- SUBSCRIBE TO CHANNEL - https://www.youtube.com/channel/UCW5YeuERMmlnqo4oq8vwUpg?sub_confirmation=1 ======== Social Links ========== Twitter - @TheNetNinja - https://twitter.com/thenetninjauk Patreon - https://www.patreon.com/thenetninja
Sign in to unlock AI tutor explanation · ⚡30

Playlist

Uploads from Net Ninja · Net Ninja · 10 of 60

1 Regular Expressions (RegEx) Tutorial #14 - Matching a Username
Regular Expressions (RegEx) Tutorial #14 - Matching a Username
Net Ninja
2 Regular Expressions (RegEx) Tutorial #15 - Email RegEx Pattern
Regular Expressions (RegEx) Tutorial #15 - Email RegEx Pattern
Net Ninja
3 Regular Expressions (RegEx) Tutorial #16 - Finishing Touches
Regular Expressions (RegEx) Tutorial #16 - Finishing Touches
Net Ninja
4 GraphQL Tutorial #1 - Introduction to GraphQL
GraphQL Tutorial #1 - Introduction to GraphQL
Net Ninja
5 GraphQL Tutorial #2 - A Birdseye View of GraphQL
GraphQL Tutorial #2 - A Birdseye View of GraphQL
Net Ninja
6 GraphQL Tutorial #3 - Project (stack) Overview
GraphQL Tutorial #3 - Project (stack) Overview
Net Ninja
7 GraphQL Tutorial #4 - Making Queries (front-end preview)
GraphQL Tutorial #4 - Making Queries (front-end preview)
Net Ninja
8 GraphQL Tutorial #5 - Express App Setup
GraphQL Tutorial #5 - Express App Setup
Net Ninja
9 GraphQL Tutorial #6 - Setting up GraphQL
GraphQL Tutorial #6 - Setting up GraphQL
Net Ninja
▶ GraphQL Tutorial #7 - GraphQL Schema
GraphQL Tutorial #7 - GraphQL Schema
Net Ninja
11 GraphQL Tutorial #8 - Root Query
GraphQL Tutorial #8 - Root Query
Net Ninja
12 GraphQL Tutorial #9 - The Resolve Function
GraphQL Tutorial #9 - The Resolve Function
Net Ninja
13 GraphQL Tutorial #10 - Testing Queries in Graphiql
GraphQL Tutorial #10 - Testing Queries in Graphiql
Net Ninja
14 GraphQL Tutorial #11 - GraphQL ID Type
GraphQL Tutorial #11 - GraphQL ID Type
Net Ninja
15 GraphQL Tutorial #12 - Author Type
GraphQL Tutorial #12 - Author Type
Net Ninja
16 GraphQL Tutorial #13 - Type Relations
GraphQL Tutorial #13 - Type Relations
Net Ninja
17 GraphQL Tutorial #14 - GraphQL Lists
GraphQL Tutorial #14 - GraphQL Lists
Net Ninja
18 GraphQL Tutorial #15 - More on Root Queries
GraphQL Tutorial #15 - More on Root Queries
Net Ninja
19 GraphQL Tutorial #16 - Connecting to mLab
GraphQL Tutorial #16 - Connecting to mLab
Net Ninja
20 GraphQL Tutorial #17 - Mongoose Models
GraphQL Tutorial #17 - Mongoose Models
Net Ninja
21 GraphQL Tutorial #18 - Mutations
GraphQL Tutorial #18 - Mutations
Net Ninja
22 GraphQL Tutorial #19 - More on Mutations
GraphQL Tutorial #19 - More on Mutations
Net Ninja
23 GraphQL Tutorial #20 - Updating the Resolve Functions
GraphQL Tutorial #20 - Updating the Resolve Functions
Net Ninja
24 GraphQL Tutorial #21 - GraphQL NonNull
GraphQL Tutorial #21 - GraphQL NonNull
Net Ninja
25 GraphQL Tutorial #22 - Adding a Front-end
GraphQL Tutorial #22 - Adding a Front-end
Net Ninja
26 GraphQL Tutorial #23 - Create React App
GraphQL Tutorial #23 - Create React App
Net Ninja
27 GraphQL Tutorial #24 - Book List Component
GraphQL Tutorial #24 - Book List Component
Net Ninja
28 GraphQL Tutorial #25 - Apollo Client Setup
GraphQL Tutorial #25 - Apollo Client Setup
Net Ninja
29 GraphQL Tutorial #26 - Making Queries from React
GraphQL Tutorial #26 - Making Queries from React
Net Ninja
30 GraphQL Tutorial #27 - Rendering Data in a Component
GraphQL Tutorial #27 - Rendering Data in a Component
Net Ninja
31 GraphQL Tutorial #28 - Add Book Component
GraphQL Tutorial #28 - Add Book Component
Net Ninja
32 GraphQL Tutorial #29 - External Query File
GraphQL Tutorial #29 - External Query File
Net Ninja
33 GraphQL Tutorial #30 - Updating Component State
GraphQL Tutorial #30 - Updating Component State
Net Ninja
34 GraphQL Tutorial #31 - Composing Queries
GraphQL Tutorial #31 - Composing Queries
Net Ninja
35 GraphQL Tutorial #32 - query variables
GraphQL Tutorial #32 - query variables
Net Ninja
36 GraphQL Tutorial #33 - Re-fetching Queries
GraphQL Tutorial #33 - Re-fetching Queries
Net Ninja
37 GraphQL Tutorial #34 - Book Details Component
GraphQL Tutorial #34 - Book Details Component
Net Ninja
38 GraphQL Tutorial #36 - Styling the App
GraphQL Tutorial #36 - Styling the App
Net Ninja
39 GraphQL Tutorial #35 - Making a Single Query
GraphQL Tutorial #35 - Making a Single Query
Net Ninja
40 Build Apps with Vue & Firebase - Udemy Course
Build Apps with Vue & Firebase - Udemy Course
Net Ninja
41 Updated Vue & Firebase Course (Udemy)
Updated Vue & Firebase Course (Udemy)
Net Ninja
42 Vue & Firebase Real-time Chat (Preview) #1 - Intro
Vue & Firebase Real-time Chat (Preview) #1 - Intro
Net Ninja
43 Vue & Firebase Real-time Chat (Preview) #2 - Project Structure
Vue & Firebase Real-time Chat (Preview) #2 - Project Structure
Net Ninja
44 Vue & Firebase Real-time Chat (Preview) #3 - Firestore Setup
Vue & Firebase Real-time Chat (Preview) #3 - Firestore Setup
Net Ninja
45 Vue & Firebase Real-time Chat (Preview) #4 - Welcome Screen
Vue & Firebase Real-time Chat (Preview) #4 - Welcome Screen
Net Ninja
46 Vue & Firebase Real-time Chat (Preview) #5 - Props in Routes
Vue & Firebase Real-time Chat (Preview) #5 - Props in Routes
Net Ninja
47 Vue & Firebase Real-time Chat (Preview) #6 - Route Guards
Vue & Firebase Real-time Chat (Preview) #6 - Route Guards
Net Ninja
48 Vue & Firebase Real-time Chat (Preview) #7 - Chat Window
Vue & Firebase Real-time Chat (Preview) #7 - Chat Window
Net Ninja
49 Vue & Firebase Real-time Chat (Preview) #8 - New Message Component
Vue & Firebase Real-time Chat (Preview) #8 - New Message Component
Net Ninja
50 Object Oriented JavaScript Tutorial #1 - Introduction
Object Oriented JavaScript Tutorial #1 - Introduction
Net Ninja
51 Object Oriented JavaScript Tutorial #2 - Object Literals
Object Oriented JavaScript Tutorial #2 - Object Literals
Net Ninja
52 Object Oriented JavaScript Tutorial #3 - Updating Properties
Object Oriented JavaScript Tutorial #3 - Updating Properties
Net Ninja
53 Object Oriented JavaScript Tutorial #4 - Classes
Object Oriented JavaScript Tutorial #4 - Classes
Net Ninja
54 Object Oriented JavaScript Tutorial #5  - Class Constructors
Object Oriented JavaScript Tutorial #5 - Class Constructors
Net Ninja
55 Object Oriented JavaScript Tutorial #6 - Class Methods
Object Oriented JavaScript Tutorial #6 - Class Methods
Net Ninja
56 Object Oriented JavaScript Tutorial #7 - Method Chaining
Object Oriented JavaScript Tutorial #7 - Method Chaining
Net Ninja
57 Object Oriented JavaScript Tutorial #8 - Class Inheritance
Object Oriented JavaScript Tutorial #8 - Class Inheritance
Net Ninja
58 Object Oriented JavaScript Tutorial #9 - Constructors (under the hood)
Object Oriented JavaScript Tutorial #9 - Constructors (under the hood)
Net Ninja
59 Object Oriented JavaScript Tutorial #10 - Prototype
Object Oriented JavaScript Tutorial #10 - Prototype
Net Ninja
60 Object Oriented JavaScript Tutorial #11 - Prototype Inheritance
Object Oriented JavaScript Tutorial #11 - Prototype Inheritance
Net Ninja

This video tutorial teaches how to create a GraphQL schema, define an object type, and understand the relationships between object types. It covers the basics of GraphQL schema design and data modeling using the GraphQL package and ES6 destructuring.

Key Takeaways
  1. Create a new folder for the schema
  2. Define the Book object type using graphQL.ObjectType
  3. Specify the fields for the Book object type, including ID, name, and genre
  4. Use ES6 destructuring to import the graphQL package and define the object type
💡 GraphQL schema design involves defining object types and their relationships to create a data model for your application.

Related Reads

📰
I Gave the Right Answer in a Senior Backend Interview. The Interviewer Changed One Constraint and My
Learn how to adapt your architecture design to changing constraints in a senior backend interview
Medium · Programming
📰
Django vs Flask vs FastAPI: Which Python Web Framework Should You Learn in 2026?
Learn which Python web framework to use in 2026 and why it matters for your career
Medium · Python
📰
Our Spring Boot API Was Fast for Months. Then Production Data Exposed What Hibernate Was Really
Optimize Spring Boot API performance by identifying and addressing Hibernate-related issues exposed by production data
Medium · Programming
📰
Our Spring Boot API Was Fast in Testing. One Hibernate Query Turned It Into 1,247 SQL Queries
Optimize Hibernate queries to prevent N+1 query problems and improve API performance
Medium · Programming
Up next
Unlock CRAZY Performance: Native Code Compilation No JNI! #shorts #quarkusinsights #projectpanama
Quarkusio
Watch →