GraphQL Queries with Django - Introducing GraphQL Queries

hello and welcome to part two of the graphql with django so in this tutorial we're going to go through queries with graphql so this tutorial is going to take us through a journey looking at the front end and the back end so actually performing graphql queries having a look at the structure of those and then actually handling those queries in the back end in django so this tutorial should get you started utilizing queries with graphql and of course there's lots more other dynamics that we could bring into this but i wanted to make this a kind of a short and sharp introduction to queries in later tutorials we'll delve a little bit deeper and we'll construct more complex queries utilizing graphql so previously i just wanted to mention in the previous tutorial we did set up django with graph so if you have or you still need to do that then just head back to the previous tutorial set that up and then i'm basically going to start from that point here in this tutorial so some different changes from the first tutorial i'm going to skip now into a more complex model structure so that we can just kind of set this up for later performing much more advanced queries etc so i'm copying or i'm utilizing the database that we set up with the building a quiz api series so here we've got four classes here four models category quizzes question and answer so this is going to allow us to use many-to-one connections our foreign keys so there's going to be a foreign key between answer and question question and quizzes and quizzes and category so i don't want to go into too much detail here i'm assuming that you've got a general idea of how to make models uh for your database so here in category i've simply just got the name field and done the string method there in quizzes you can see that we've got the uh the foreign key here to the category so that's going to build a connection to the categories and then just some other sorry some other fields here that you can obviously extend if you want to and then with question we're going to have some drop downs here or some selections selections so you can see here we've got the foreign key that's connected to the quizzes table that was the uh the model up before the quizzes and then finally the answers uh we've just got a few different fields here uh one of them question we've got a foreign key here which is connected to the question the previous table again and that's pretty much it there for the models so have a look at this code it's in the tutorial sorry it's in the code repository uh if you have a look in the description of this tutorial you'll be able to have a look at these models okay so in addition to that in the first tutorial we set up books so i have made a new app here for quiz and i put those models you've just seen inside in addition to that obviously i've added that into the settings into the installed apps of course in the urls here you can see um i've got the obviously connection with include uh which i've included the quiz urls and if we go into the quiz we've got our urls and at the moment we've just set up the one url so this is exactly the same in the first tutorial where we set up the path to the graphql front end so that we could actually have a graphical user interface and enter some graphql queries so we'll do the same thing in this tutorial okay so the last bit of setup here is in the schema so obviously this is going to be changed from the first tutorial now i've got these four models i've just built i'm going to make a django object type of these four models here so i bring in the the models as per normal um i'm going to be utilizing django object type from the graphene django package so i go ahead and create the classes and then i just really need to just define the data that i want to return so i've added the graph django django list field which we'll use shortly i've just added that in for now i'll explain that in shortly so you can see here we've just added the meta for each of these classes each of our models we just identify the actual model we're connected to and then the fields that we want to include and obviously what we're doing here is we're just setting out or setting up our data so that it can then be queried okay so there we go so these are just all the fields that are connected to my models so that kind of summarizes um our schema up to that point so i apologize if that's too quick or not enough detail like i said or you've probably seen if you've seen the first tutorial we kind of covered that element or we've covered those elements previously so the outcome of this schema document here is that we want to develop a schema so in graphql schema basically will define the types and relationships between the fields so that we can query upon it and what we're doing here utilizing these django object types is we're taking our existing models which is obviously in python and we're kind of converting that or making it available for us to actually then convert into a format that we can then actually build a schema for our data so let's just remember that the django object type is from the graph graphene django package that we installed previously so again if you're following this and you haven't seen the first tutorial you're going to need to install the graphene django package if you go down to the commands text in actual fact it's right here what we're doing or what we did previously and these are the five tasks that we're going to perform in this tutorial so now let's just remember this is basically just preparing the data so then we can put that into our query and then obviously make a schema from it so typically what we now do is we're going to create a new class which you don't have to call query so but we're going to call this query so we go ahead and we just build this new class here now what's going to happen in within this class is essentially we're going to take this data eventually and we're going to then define it with inside of this query so once we've done that we then go ahead and we build our schema from the query class so graphene schema and then we take uh the query class here and we build our schema utilizing the graphing schema uh extending from graphing to schema so that puts it into this nice little variable here our schema and that's essentially what we're then going to utilize to build or to run queries upon so if we go back into our urls notice that the path that we give to this graphql where we will have the graphical front end where we'll be able to perform some queries and we bring in the schema here now i did mention previously in the previous tutorial um that you could do this one of two ways you can put the schema here or you can go into the settings and you can set up the schema inside of there or define the schema inside of there so here we're just using the url here to define the schema and obviously we actually bring that schema in so the quiz.schema that's been brought in from this file here and obviously been taken from here so you can start to see the path here we set up some data we're bringing it into the query that's available then for the url and then obviously we can pass in queries to that essentially and then obviously return data so let's go ahead and build a simple query to begin with so let's go ahead and build this new field here so we've got this variable here called quiz and we're defining it as a string and then what we're going to need to do is build a resolve for this so let's build a resolve here and then let's just go ahead and return maybe just this string uh this is the first question okay so there we go that's pretty much the dynamics of this query here we're going to need some reference to some data so here what would norm you'd normally see uh what we'll do later is we build a a variable which is connected to one of our model data's here or our model types here uh and you can see what's going to happen is that we're going to query a quiz and we're going to resolve it by returning uh this string here so just make sure the server's on and it's running so it should start up with the code that you've seen so far so once you've started your server navigate over to graphql here and you'll be welcome to graph iql and you can see that that url just matches up what we've got here in the path obviously you can change this if you want to now what you're looking at here is a graphical graphical interface that allows us to kind of test out our queries on the left-hand side here we write our queries here and in the middle that's the data returned so what you need to imagine here is that react is the front end where we'll be running our queries we'll be sending that across to our api which will then draw out the data so the data is going to appear in the middle here that's the data that will get returned from any of the queries that we define so the good thing here is that we've already built this schema so this program this front end is actually taking the schema and is able to read it so that's going to help prompt us so you can see when i start typing in letters it prompts us with different things so we'll be explicit here and we'll start with query so obviously we want to run our query so that's going to be kind of our root there and then inside of our query we want to run something so what's inside of our query well if i type in q you notice that it picks up quiz uh what we've defined here our quiz here so if we run this in actual fact is going to cause an error but let's just go ahead so this is a valid query that we're running here so i just run that and you can see that we get an error so not only do we get data we'll also return an error so that just allows us now to think about what we need to do so here it says resolve queer zero positional arguments but two were given so back at the code the two positional arguments that are missing is root now this probably needs a bit of a build up here and i don't want to go into any real explanation of what these two arguments are but root uh let's just think about that about that as an entry point so this is the entry point into our query so we're going to run root and then info is going to allow us to pass in some information um that's going to be needed to run our query so these are the two positional arguments that we're going to need and if we go back and run our query you can see that now we're actually returning the string so there we go that's a the most basic setup we can do with graphql in terms of queries so you can see that we've set up our data and then we've got a result for it and our resolve is simply just in this case uh just running some strings here so what's going to happen obviously now is that we're going to change this into one of our models and then what we return is obviously the data from the model so let's go ahead and try this out so the graphene django package comes with some really kind of handy fields for us functions for us to utilize and one of these is the django list field so what we can do is just bring that in i think i did bring in already so the django list field so that's going to allow us to uh generate lists or return lists from our database now what we're going to find here is that we don't need to resolve for this so let's just go ahead now and build this so what we're going to do is just return for example all of the quizzes so this is just going to return maybe the title and the idea of all the quizzes that we set up now i have already ready i have already gone ahead and set up some data in this system now i've gone ahead and you can have a look at the code repository for this so this is the admin for this system again this is just taken from the quiz api series so we've just registered all of our models inside of the admin the quiz an answer etc so you can go off into the admin and set up some data so like i said i've already done that so i am presuming you know how to do that here so now i'm just going to go ahead and set this up so let's go ahead and just return all the quizzes that are currently in the system so all i need to do here all uh quizzes say let's just go for yeah all quizzes so that's my variable name and then that's going to equal in this case we're going to now use the django list field we're going to bring that in so it lists all of the items and now we just need to define the model so all quizzes that's going to be the quiz type that's the model we want to get the data from so put that in there and there we go so that's simply now defined that should return all the data now inside of this model so let's just go back here now remember all quizzes and now what you're going to need to do here is if i were to now just type something in here you can see that it's not picking up all quizzes so because we've set up a new schema we now just need to refresh and then we can now go back in type in all and now you can see it picks up all quizzes okay so now that's in place we can now define what data we want to return if we go back into our models uh quizzes here we've got id title category and quiz so let's just turn uh return the id and the title so it's as simple as that and you can see that i am prompted for that you can see this is available categories available and titles available so i just press go or execute and there we go so we've now returned that data from the database so you can see there that by utilizing uh the django list field here uh this function here just allows us to oh we don't we don't need a uh a return or resolve sorry from it so uh that can be pretty handy in some situations so obviously you'll outgrow that very quickly and you'll want to generate some more custom queries right so we'll need to maybe model our data in the background here to kind of restrict or exclude and of course we can run django commands and we can run django filters here um in the background so what we can do here in actual fact is we can just extend this so we can now set out a custom resolve so we do the same thing again resolve and then we just bring in all quizzes and then obviously we're going to need to define our route and info and then now what we can do is we can return so what we're going to do now is if you're familiar to django we're just going to create a simple filter so what we need to do is obviously define our model that is going to be quizzes and then we know we're going to use the object manager and then what we can do is for example just uh let's just start off with all so that's obviously just going to return all the data as if you're just going to run this command here right so let's just uh make sure that works so refresh and press enter and you can see that that has returned exactly the same information so what we're building up to here obviously is that we can now go ahead and for example we can run a filter so id equals one so that's or exclude one however you want to run that so now i'm just going to return the id where id equals one and obviously i can run queries then on just the first item of course i probably wouldn't want to do that that's just to demonstrate how this can work or how you can utilize this in the background so let's just run that again and that just returns the one item the id1 obviously it's been specified as the filter so it's probably worth noting at this point uh that's not the only way we can work here so we don't have to use the django list field we can just use the graphing list option that's going to provide a similar type of feature so if i were to run this for example with graphing list refresh you can see that i'm returning exactly the same data okay so we can extend this maybe we've got two resolves and we want to run them at the same time for example so for example we want to get all quizzes and we want to get all questions now we're not making any relations here i'm just showing you that we can run multiple kind of queries here at the same time so now we're going to bring in uh the question type so from here we've got the question type we've got title and quiz available as the fields so we're just going to bring in this and we do the same thing again here but this time obviously we'll go ahead and this is going to be all questions and then we're going to bring in obviously from question to object or filter so let's just get rid of the filters let's just do um all on both so you can see here i've got two queries and i'm going to run i can run these at the same time so this is what i just wanted to demonstrate so that's that's now set up so if i want to collect more data from the front end i can now just go ahead and extend this query because now i'm go oh sorry i just need to refresh of course so now i've got the option of all questions so same kind of thing applies here so i can see what's available by typing in something i can see that title is available so i'm going to bring in that field i press enter or run the query and there we go so that's the data that's now returned so there's only two questions in my database at the moment so that's all the questions and that is all the quizzes that are currently available so of course that's going to work in a similar way if we were going to utilize the django list field so for example if i change these django list fields here um have a look at the specifications of the graphene django package uh if you wanted to learn a little bit more about some of these other custom fields the documentation isn't actually completed there are some things that haven't been created yet and i guess this is still in i want to say this is still a maturing technology if you like with django so let's go ahead and just run that so refresh and just show you that that will work and notice when i refresh i'm giving like the history so i can that's pretty handy function uh remembers the history of all the queries i've run so i can run that in exactly the same way so once we get to this point what you probably want to start thinking about now is to generate arguments so we want to specify or we want to have more control of what data is returned of course we we saw that we can set up filters here in the back end but of course that's not ideal ideally we want to customize our query in the front end to return specific information so let's have a look at arguments so looking at the front end to begin with the format we got here with arguments is pretty simple uh so we're going to run some parentheses here and then we're basically just going to specify our argument so say id and then we can just run a number so let's put that in speech mark so id and one for example so we could run something like that very easily so that's kind of the format in the front here so obviously we want to get all quizzes where the id equals one that's essentially what we're saying here with this setup so let's go to the back end and see if we can get this working so we're just going to let's just slim this down slightly let's just get rid of questions so we're just going to work with quizzes for now and to give you a simple example so the first thing we're going to do is just return a single item now what we're doing at the moment is we've been working with lists but of course we want to return a single item then we're going to need to change this django list field and we're going to need to change that into a field all right so let's just go ahead and just use the graphene version so this is going to be dot and then field so we're just here just specifying the fact that we no longer want to get a list we want to get just an individual field so same as normal we define the model that we're using and now we just need to define um the actual argument name so it's going to be id so that's what we're going to pass across so we're looking for id and then we just need to define what type of data it is so we're going to say graphing in this case it's going to be an integer and there we go so we've just defined the the name of the parameter or the variable if you like from the front end and then the type of data that's going to be sent across so now we've got that so we can now pass that in so now we need to kind of resolve this so that's easily done because we can just run this filter here right so let's do a filter or alternatively let's just run get and then that's just going to say primary key equals and then id so idea here is referencing this id right here okay so we pass that data in that's going to then represent a primary key in the table and obviously number one is just going to return one item okay so that's going to be a single field so let's just go to the front end and before actually we go to the front and i've forgotten we need to bring this into the function so we need to bring id into this function here so after info let's just add that in so we can bring it in and otherwise that won't work okay so now we can go to the front end so don't forget to refresh here but you can see now that if i run this query it's not going to return anything it says one positional argument needed and that's the id so let's just go ahead like before so we're going to say id and then we're going to give it the this is going to be id for example one so we want to return from the database the quiz where the id equals one so let's run that and there we go so that's passing arguments and at this point you can see how that could now be a little bit more powerful to generate more effective queries so just one more example here uh in this tutorial so this isn't necessarily the way to do it but i just want to show you some of these tools so we're just going to work this way just this once so what we're going to do now is let's just bring in all the answers so we're going to set this up so we bring in the answers and then also the questions so we're going to get all the questions with all the answers that's what we're going to be working towards so let's just call that questions uh so this is going to be a field so we're going to bring back we're going to return one question with all its answers so this is going to be a field and we're going to we're going to bring in question type that's the data that we want to bring in the question type so that's going to be an id yep that's no problem so then we want the the answers so again graphene and this is going to be a list now this is where doing it this way just to show you the field in the list so we'll see the answers there's more than one answer in a question so that we're going to return a list so let's go for answer type that's the data right here so that's the data type and then we'll go ahead and id i'll bring an id again and that's going to be graphene that's going to be an integer again okay so there we go so we've set up that and now we can go ahead and just make another result so we just copy that obviously we need to set that up for uh the questions and this one here is going to be for the answers so we're going to bring in the id as per normal and obviously what's here this is going to need to be changed so here we've got questions or question and here we got the answers there we go okay so now that's set up uh let's go ahead to the front end so first thing has been normal let's just refresh uh so let's just uh first of all let's just grab all the questions so it prompts me all questions and our questions we can't grab the id so let's just go for title there we go so this is the um the title of the first question or the question that has the id one in this example okay so that's question number one so let's get all the answers for this so let's go for all answers now it's the same situation here so all answers where the id is one so let's bring back whatever it is we can do so in answers we've got the answer text so let's just bring that back in there we go and refresh it says user error expected iterable but did not find one for field query all answers okay um so what's happening here you'll notice is that i've selected id one and remember here the error here if you're remembering is that i'm bringing back a list but because i've defined a list it's kind of expecting more than one thing and here you notice that i've set this up in a way that well it doesn't kind of work here because i've selected the id so i'm just returning one item so let's go back into our model so what i'm trying to do here is i want to get all the questions from a particular question that we've selected so this has a foreign key here to question so the question has an id so i want to make sure that i pick all the questions from my database that has the same id as the question so i can use this question foreign key here to actually query against that uh hopefully that makes sense to you so uh let's go back into the code here so obviously every question inside of this answer has is going to have a question id and that's going to match a particular question or it's going to allow us to match it to a particular question so let's go down here instead of pk and the primary key we're going to say question so the question id so by doing that and refreshing now let's get back into the code here so the id is still id yep so if i run this you can now see what's happened is that return more than one answer it returns three that's not a problem because there might be more than one answer right so that isn't a problem so what might be the issue now so you can see this is just a simple code error and the the key is just here where it says get so obviously we can't use get here because get is referring to a single item or returning a single item so this is where we're going to run a filter so we change that to filter and then we're just going to refresh and then we run that again and there we go so we now have this question which is just called question one and we have now all the answers for this question okay so that's a simple example passing in arguments so if i can just remove that and just pull this over a little bit and zoom in so what we have here also is this is basically the operation okay we can describe this as the operation type so here we might have query mutation mutation is going to allow us to actually send data to the database and change the database we also have subscription which we'll talk about in later tutorials so we'll just focus on querying this tutorial now what we also have here is an operation name so um for example we can call us whatever you like get questions or get answers um this isn't going to affect the query at all uh so this is going to be helpful in production for us to identify this this query so in addition to this now this is obviously one way of passing in variables here or arguments so what we can also do is we can do this at the operation level so we can set up the arguments so let's go ahead and do that so for example here let's set out id and that's going to be uh an integer so we're just describing integer um and that's going to equal 1. there we go so we set up this variable here and we've put inside of an integer which um equals one right so what we can then do now is uh describe this or utilize this what is variable inside of our query here okay so let's just not forget to i was just wondering why that was cause an error so let's do that so we just finish off those parentheses there and then we should now be able to run that as per normal and there we go so we can define the variables here at the top in our operation type nearer operation type and we can then pass that into our query okay so there we go that was an introduction to queries obviously things can get more complicated than this there's other tools that we can utilize in query ql when we start thinking about making uh connections and traversing our a graph as such or our traversing our schema etc there's obviously lots more things that we can discuss but hopefully that was a good introduction for us utilizing queries extracting data from our database with graphql thank you very much for listening hopefully this was useful and i'll see you in the next tutorial

Channel: Very Academy

Views: 7,117

Keywords: graphql, django, django graphql, graphql schema, django objects, django generic views, django tutorial, djangotutorial, django tut, django beginners, djangoproject, django examples, learn django, beginners django, django framework, django 2020, django example, graphql tutorial, graphql queries, DjangoListField, graphql arguments

Id: unz3RgL9A-Y

Length: 32min 23sec (1943 seconds)

Published: Tue Nov 24 2020