title
#3 Schemas & Resolvers | Build a Complete App with GraphQL, Node.js, MongoDB and React.js

description
GraphQL time! Let's dive into GraphQL and set up a first schema and a first set of GraphQL resolvers. We'll do that on our Node + Express server so that we later can consume the API from our React.js frontend. ---------- Node.js full course (includes GraphQL): https://acad.link/nodejs React.js full course: https://acad.link/reactjs MongoDB full course: https://acad.link/mongodb Learn more about the type system: https://graphql.org/learn/schema/#type-system Finished Code: https://github.com/academind/yt-graphql-react-event-booking-api/tree/02-graphql-start Complete Playlist: https://academind.com/learn/node-js/graphql-with-node-react-full-app/ Want to learn something totally different? Check out all other courses: https://academind.com/learn/our-courses ---------- • You can follow Max on Twitter (@maxedapps). • And you should of course also follow @academind_real. • You can also find us on Facebook.(https://www.facebook.com/academindchannel/) • Or visit our Website (https://www.academind.com) and subscribe to our newsletter! See you in the videos! ---------- Academind is your source for online education in the areas of web development, frontend web development, backend web development, programming, coding and data science! No matter if you are looking for a tutorial, a course, a crash course, an introduction, an online tutorial or any related video, we try our best to offer you the content you are looking for. Our topics include Angular, React, Vue, Html, CSS, JavaScript, TypeScript, Redux, Nuxt.js, RxJs, Bootstrap, Laravel, Node.js, Progressive Web Apps (PWA), Ionic, React Native, Regular Expressions (RegEx), Stencil, Power BI, Amazon Web Services (AWS), Firebase or other topics, make sure to have a look at this channel or at academind.com to find the learning resource of your choice!

detail
{'title': '#3 Schemas & Resolvers | Build a Complete App with GraphQL, Node.js, MongoDB and React.js', 'heatmap': [{'end': 1295.576, 'start': 1241.35, 'weight': 0.799}], 'summary': 'Series covers implementing a graphql api in node express, setting up graphql environment and request handling, creating graphql schema and resolvers, essentials of graphql queries and mutations, and using graphql interface for operations, with a focus on practical application and examples for a complete app.', 'chapters': [{'end': 125.786, 'segs': [{'end': 125.786, 'src': 'embed', 'start': 52.941, 'weight': 0, 'content': [{'end': 57.003, 'text': 'So the job of the backend will be to parse these incoming queries,', 'start': 52.941, 'duration': 4.062}, {'end': 65.688, 'text': 'to understand these commands sent by the frontend and deliver the right data back to the frontend, or do whatever the query instructs us to do.', 'start': 57.003, 'duration': 8.685}, {'end': 70.771, 'text': 'There also are mutations which want the server to save or delete or update something.', 'start': 65.948, 'duration': 4.823}, {'end': 74.252, 'text': 'So parsing these queries will be important.', 'start': 71.391, 'duration': 2.861}, {'end': 78.494, 'text': 'And to parse a query, we essentially need two parts, you could say.', 'start': 74.792, 'duration': 3.702}, {'end': 86.117, 'text': 'First of all, we need a package or a tool that is capable of understanding GraphQL queries.', 'start': 79.154, 'duration': 6.963}, {'end': 88.618, 'text': 'Now, these queries are standardized.', 'start': 86.557, 'duration': 2.061}, {'end': 92.66, 'text': 'The keywords you can use there are standardized because there is a specification.', 'start': 88.778, 'duration': 3.882}, {'end': 95.441, 'text': 'So such parsing packages exist.', 'start': 93.12, 'duration': 2.321}, {'end': 101.405, 'text': 'the other part is that we need to define the capabilities of our api.', 'start': 96.261, 'duration': 5.144}, {'end': 106.009, 'text': 'we need to define which kind of queries can we handle?', 'start': 101.405, 'duration': 4.604}, {'end': 109.352, 'text': 'which kind of mutations can we take care of?', 'start': 106.009, 'duration': 3.343}, {'end': 113.435, 'text': 'because if a front-end application wants to get all users,', 'start': 109.352, 'duration': 4.083}, {'end': 123.524, 'text': 'this is only possible if we defined a so-called schema on the back end in our graphql api that knows what to do when such users are requested.', 'start': 113.435, 'duration': 10.089}, {'end': 125.786, 'text': "So we'll have to take care about both.", 'start': 124.184, 'duration': 1.602}], 'summary': 'Backend parses queries, handles mutations, defines api capabilities for graphql.', 'duration': 72.845, 'max_score': 52.941, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/LXTyzk2uud0/pics/LXTyzk2uud052941.jpg'}], 'start': 2.349, 'title': 'Implementing graphql api in node express', 'summary': 'Covers setting up a basic node express server and implementing a graphql api, focusing on parsing queries, defining api capabilities, and handling mutations to deliver data to the frontend.', 'chapters': [{'end': 125.786, 'start': 2.349, 'title': 'Implementing graphql api in node express', 'summary': 'Covers setting up a basic node express server and then proceeding to implement a graphql api, emphasizing the importance of parsing queries and defining the capabilities of the api, with a focus on delivering the right data back to the frontend and handling mutations.', 'duration': 123.437, 'highlights': ['The importance of parsing incoming queries and understanding commands sent by the frontend to deliver the right data back to the frontend, or perform actions as instructed by the query. Emphasizes the critical role of parsing incoming queries and delivering the right data to the frontend.', 'The need to define the capabilities of the GraphQL API by specifying which kind of queries and mutations it can handle, ensuring that the backend knows what to do when specific requests are made. Highlights the necessity of defining the capabilities of the GraphQL API to handle specific queries and mutations.', 'Explaining the standardized nature of GraphQL queries and the existence of parsing packages capable of understanding these standardized queries. Explains the standardized nature of GraphQL queries and the availability of parsing packages to understand these queries.']}], 'duration': 123.437, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/LXTyzk2uud0/pics/LXTyzk2uud02349.jpg', 'highlights': ['Emphasizes the critical role of parsing incoming queries and delivering the right data to the frontend.', 'Highlights the necessity of defining the capabilities of the GraphQL API to handle specific queries and mutations.', 'Explains the standardized nature of GraphQL queries and the availability of parsing packages to understand these queries.']}, {'end': 346.504, 'segs': [{'end': 234.537, 'src': 'embed', 'start': 210.681, 'weight': 0, 'content': [{'end': 218.326, 'text': 'So it will parse our schema and convert it, and we can then use this parsed and converted schema together with Express GraphQL, you could say.', 'start': 210.681, 'duration': 7.645}, {'end': 224.59, 'text': 'So these are the two packages we need, and I will just hit Enter, and how we use them will become clearer in a second.', 'start': 218.926, 'duration': 5.664}, {'end': 230.714, 'text': "With both installed, I'll run npm, start again to bring up that development server again.", 'start': 225.331, 'duration': 5.383}, {'end': 234.537, 'text': "and now let's start setting up our GraphQL environment and schema here.", 'start': 230.714, 'duration': 3.823}], 'summary': 'Setting up graphql environment with express graphql, using npm start to bring up development server', 'duration': 23.856, 'max_score': 210.681, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/LXTyzk2uud0/pics/LXTyzk2uud0210681.jpg'}, {'end': 346.504, 'src': 'embed', 'start': 267.23, 'weight': 1, 'content': [{'end': 277.594, 'text': 'and what this middleware function will do is it will take incoming requests and funnel them through the graphql query parser and automatically forward them to the right resolvers,', 'start': 267.23, 'duration': 10.364}, {'end': 281.496, 'text': 'and that will be our duty to set the resolvers and schemas up.', 'start': 277.594, 'duration': 3.902}, {'end': 283.876, 'text': 'so how do we use this middleware?', 'start': 282.256, 'duration': 1.62}, {'end': 290.078, 'text': 'well, instead of having this get request here, i will now add a normal app use statement,', 'start': 283.876, 'duration': 6.202}, {'end': 295.799, 'text': 'and here i want to handle requests that reach our graphql endpoint.', 'start': 290.078, 'duration': 5.721}, {'end': 300, 'text': 'now, remember the first video in this series.', 'start': 295.799, 'duration': 4.201}, {'end': 306.581, 'text': 'there i mentioned that with graphql you have only one endpoint to which all requests are sent.', 'start': 300, 'duration': 6.581}, {'end': 315.945, 'text': 'typically this is reached under the graphql path of your domain, so yourdomain.com graphql.', 'start': 306.581, 'duration': 9.364}, {'end': 321.147, 'text': 'you can name this however you want, though you could also use slash api or whatever you want.', 'start': 315.945, 'duration': 5.202}, {'end': 323.107, 'text': "i'll go with graphql.", 'start': 321.147, 'duration': 1.96}, {'end': 325.488, 'text': 'the second argument here is our middleware function.', 'start': 323.107, 'duration': 2.381}, {'end': 334.392, 'text': 'then that is normal express js code, and the middleware function here is our graphql http function we imported from the express graphql package.', 'start': 325.488, 'duration': 8.904}, {'end': 341.278, 'text': 'Now in there we pass a JavaScript object where we configure our GraphQL API,', 'start': 334.992, 'duration': 6.286}, {'end': 346.504, 'text': 'because this express GraphQL package basically needs some information pieces from us.', 'start': 341.278, 'duration': 5.226}], 'summary': 'Middleware funnels requests through graphql query parser and forwards to resolvers, set up with schemas. usage involves setting up middleware function with express js code.', 'duration': 79.274, 'max_score': 267.23, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/LXTyzk2uud0/pics/LXTyzk2uud0267230.jpg'}], 'start': 126.186, 'title': 'Graphql environment setup and request handling', 'summary': 'Covers setting up a graphql environment including the installation of necessary packages, focus on middleware functions, and handling requests in the graphql endpoint with express.js. it emphasizes using only one endpoint for all requests.', 'chapters': [{'end': 290.078, 'start': 126.186, 'title': 'Setting up graphql environment and schema', 'summary': 'Covers the installation of necessary packages for setting up a graphql environment, including the use of express-graphql and graphql packages to define and parse the schema, with a focus on setting up middleware functions for handling incoming requests and connecting them to the right resolvers.', 'duration': 163.892, 'highlights': ['The installation of necessary packages such as express-graphql and GraphQL is essential for setting up a GraphQL environment to define and parse the schema as well as handle incoming requests. Necessary packages installation, express-graphql and GraphQL usage, defining and parsing the schema, handling incoming requests', 'The use of express-graphql package allows for the automatic connection of the schema and resolvers, with the middleware function GraphQL HTTP being essential for funneling incoming requests through the graphql query parser. Automatic connection of schema and resolvers, use of middleware function GraphQL HTTP, funneling requests through query parser', 'The middleware function GraphQL HTTP exports a valid middleware function that takes incoming requests and automatically forwards them to the right resolvers, with the responsibility of setting up the resolvers and schemas. Export of valid middleware function, automatic forwarding of requests to resolvers, setting up resolvers and schemas']}, {'end': 346.504, 'start': 290.078, 'title': 'Handling requests in graphql endpoint', 'summary': 'Demonstrates handling requests in the graphql endpoint using express.js and configuring the graphql api with a javascript object, highlighting the importance of having only one endpoint for all requests.', 'duration': 56.426, 'highlights': ['The chapter demonstrates handling requests in the GraphQL endpoint using Express.js and configuring the GraphQL API with a JavaScript object.', 'Express GraphQL package requires configuration through a JavaScript object to handle GraphQL API, consolidating all requests into one endpoint for improved efficiency and maintainability.']}], 'duration': 220.318, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/LXTyzk2uud0/pics/LXTyzk2uud0126186.jpg', 'highlights': ['Necessary packages installation, express-graphql and GraphQL usage, defining and parsing the schema, handling incoming requests', 'Automatic connection of schema and resolvers, use of middleware function GraphQL HTTP, funneling requests through query parser', 'Export of valid middleware function, automatic forwarding of requests to resolvers, setting up resolvers and schemas', 'Consolidating all requests into one endpoint for improved efficiency and maintainability', 'Demonstrating handling requests in the GraphQL endpoint using Express.js and configuring the GraphQL API with a JavaScript object']}, {'end': 891.265, 'segs': [{'end': 425.675, 'src': 'embed', 'start': 398.857, 'weight': 2, 'content': [{'end': 405.84, 'text': 'And that will, in the end, point at an object, a JavaScript object, which has all the resolver functions in it.', 'start': 398.857, 'duration': 6.983}, {'end': 412.262, 'text': 'And resolver functions need to match our schema endpoints by name.', 'start': 406.7, 'duration': 5.562}, {'end': 416.204, 'text': 'And this will become clearer once we add our first schema and our first resolver.', 'start': 412.362, 'duration': 3.842}, {'end': 423.551, 'text': 'So now that we added these two keys, we are almost ready to make our GraphQL API work.', 'start': 417.341, 'duration': 6.21}, {'end': 425.675, 'text': "Of course, it's not doing much, though.", 'start': 424.032, 'duration': 1.643}], 'summary': 'Javascript object with resolver functions matches schema endpoints, ready for graphql api.', 'duration': 26.818, 'max_score': 398.857, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/LXTyzk2uud0/pics/LXTyzk2uud0398857.jpg'}, {'end': 504.746, 'src': 'embed', 'start': 478.516, 'weight': 1, 'content': [{'end': 484.318, 'text': 'so this build schema function takes a string, and that string should define our schema.', 'start': 478.516, 'duration': 5.802}, {'end': 492.021, 'text': 'the advantage of this approach is that we can build our schema as a string, so in a convenient written form,', 'start': 484.318, 'duration': 7.703}, {'end': 499.204, 'text': 'and the heavy lifting of converting this to javascript objects and so on is taken care of by this graphql package.', 'start': 492.021, 'duration': 7.183}, {'end': 504.746, 'text': 'so this graphql package will generate a graphql schema object in the end, based on our written schema.', 'start': 499.204, 'duration': 5.542}], 'summary': 'Build schema function converts string to graphql schema object.', 'duration': 26.23, 'max_score': 478.516, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/LXTyzk2uud0/pics/LXTyzk2uud0478516.jpg'}, {'end': 697.042, 'src': 'embed', 'start': 668.838, 'weight': 0, 'content': [{'end': 674.483, 'text': "And in this object, we'll define different real endpoints we support for incoming queries.", 'start': 668.838, 'duration': 5.645}, {'end': 676.886, 'text': "And I'll do the same for a mutation.", 'start': 675.163, 'duration': 1.723}, {'end': 679.129, 'text': 'Here I have my root mutation.', 'start': 677.206, 'duration': 1.923}, {'end': 680.511, 'text': 'This could also be named differently.', 'start': 679.189, 'duration': 1.322}, {'end': 683.154, 'text': 'And there I will define my different mutations.', 'start': 680.991, 'duration': 2.163}, {'end': 691.32, 'text': 'In this query, so in the schema object down there, I will now point at root query, which will basically bundle all my supported queries.', 'start': 684.358, 'duration': 6.962}, {'end': 697.042, 'text': 'And for the mutation, I will point at root mutation, which bundles all my supported mutations.', 'start': 692.381, 'duration': 4.661}], 'summary': 'Defining real endpoints for incoming queries and mutations, bundling supported queries and mutations in root query and root mutation.', 'duration': 28.204, 'max_score': 668.838, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/LXTyzk2uud0/pics/LXTyzk2uud0668838.jpg'}, {'end': 765.975, 'src': 'embed', 'start': 737.906, 'weight': 4, 'content': [{'end': 745.189, 'text': 'And therefore we need to define our own interpretation for this query language behind the scenes, on the back end,', 'start': 737.906, 'duration': 7.283}, {'end': 752.372, 'text': 'or we basically need to well define what commands we want to support, what data you can fetch?', 'start': 745.189, 'duration': 7.183}, {'end': 759.954, 'text': 'And that is also the reason why GraphQL uses types, because this makes it easy for us to talk about one and the same thing.', 'start': 752.912, 'duration': 7.042}, {'end': 765.975, 'text': 'We are very clear about which data a certain endpoint returns and which data a certain field holds.', 'start': 760.334, 'duration': 5.641}], 'summary': 'Defining commands and data for graphql using types simplifies communication and clarity.', 'duration': 28.069, 'max_score': 737.906, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/LXTyzk2uud0/pics/LXTyzk2uud0737906.jpg'}, {'end': 831.816, 'src': 'embed', 'start': 803.865, 'weight': 3, 'content': [{'end': 811.189, 'text': 'because we basically think of it as being accessed like a property on an object that magically holds a list of all the data.', 'start': 803.865, 'duration': 7.324}, {'end': 814.171, 'text': 'this should return, in this case a list of events.', 'start': 811.189, 'duration': 2.982}, {'end': 819.274, 'text': 'so here we have a list of events and this query also returns some data.', 'start': 814.171, 'duration': 5.103}, {'end': 825.875, 'text': 'of course, We signal the return type by adding a colon and then, on the right side of the colon, we have the data that is returned.', 'start': 819.274, 'duration': 6.601}, {'end': 831.816, 'text': "Here, let's keep it simple, and let's say this is a list of strings, an array of strings.", 'start': 826.475, 'duration': 5.341}], 'summary': 'Query returns a list of events and data, with the return type being an array of strings.', 'duration': 27.951, 'max_score': 803.865, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/LXTyzk2uud0/pics/LXTyzk2uud0803865.jpg'}], 'start': 347.324, 'title': 'Graphql setup and basics', 'summary': 'Covers setting up a graphql schema and resolvers using javascript object with resolver functions, and understanding the basics of graphql, including its query language and defining supported commands. it includes details on specifying return types, such as non-nullable lists of strings.', 'chapters': [{'end': 713.672, 'start': 347.324, 'title': 'Setting up graphql schema and resolvers', 'summary': 'Explains how to define a graphql schema with query and mutation endpoints, using a javascript object with resolver functions, and how to build the schema as a string and pass it to the graphql package for generating a valid graphql schema object.', 'duration': 366.348, 'highlights': ['Defining GraphQL schema with query and mutation endpoints Explains the process of defining query and mutation endpoints within a GraphQL schema object and how it bundles supported queries and mutations.', 'Building the schema as a string and passing it to the GraphQL package Discusses the use of the build schema function to create a GraphQL schema as a string, which is then passed to the GraphQL package for generating a valid GraphQL schema object.', 'Using resolver functions in a JavaScript object Mentions the necessity for resolver functions to match the schema endpoints by name and how they are stored in a JavaScript object pointed to by the root value key.']}, {'end': 891.265, 'start': 713.672, 'title': 'Understanding graphql basics', 'summary': 'Explains the basics of graphql, including its query language, defining supported commands, and specifying return types, such as a list of events which returns a non-nullable list of strings.', 'duration': 177.593, 'highlights': ['GraphQL exposes a full query language to the front end, requiring a defined interpretation and supported commands on the back end, using types to specify returned data.', 'Defining a command to support returning a list of events, treating it as a property of an object holding a list of events, and specifying the return type as a non-nullable list of strings.']}], 'duration': 543.941, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/LXTyzk2uud0/pics/LXTyzk2uud0347324.jpg', 'highlights': ['Defining GraphQL schema with query and mutation endpoints Explains the process of defining query and mutation endpoints within a GraphQL schema object and how it bundles supported queries and mutations.', 'Building the schema as a string and passing it to the GraphQL package Discusses the use of the build schema function to create a GraphQL schema as a string, which is then passed to the GraphQL package for generating a valid GraphQL schema object.', 'Using resolver functions in a JavaScript object Mentions the necessity for resolver functions to match the schema endpoints by name and how they are stored in a JavaScript object pointed to by the root value key.', 'Defining a command to support returning a list of events, treating it as a property of an object holding a list of events, and specifying the return type as a non-nullable list of strings.', 'GraphQL exposes a full query language to the front end, requiring a defined interpretation and supported commands on the back end, using types to specify returned data.']}, {'end': 1274.348, 'segs': [{'end': 957.786, 'src': 'embed', 'start': 912.512, 'weight': 0, 'content': [{'end': 915.733, 'text': 'we would typically call a function or a method on an object.', 'start': 912.512, 'duration': 3.221}, {'end': 920.074, 'text': 'And hence we will name this mutation just as we would name a function.', 'start': 916.233, 'duration': 3.841}, {'end': 924.716, 'text': 'We would not name it event, we would name it createEvent typically.', 'start': 920.194, 'duration': 4.522}, {'end': 932.178, 'text': "create event is what we create, and there, let's say, we expect one value the name.", 'start': 925.776, 'duration': 6.402}, {'end': 941.46, 'text': 'we can name this, however we want, and then the type of this signal by adding a colon, after it also will be a string, and this then might return,', 'start': 932.178, 'duration': 9.282}, {'end': 943.68, 'text': "let's say, a string again.", 'start': 941.46, 'duration': 2.22}, {'end': 947.141, 'text': 'so maybe it just echoes back the name of the event we wanted to create.', 'start': 943.68, 'duration': 3.461}, {'end': 957.786, 'text': 'Now we have to find these two commands, or these two properties of our root query and of the root mutation our GraphQL API should support.', 'start': 948.281, 'duration': 9.505}], 'summary': 'Naming mutations as functions, creating events with one value, and specifying signal type and return type.', 'duration': 45.274, 'max_score': 912.512, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/LXTyzk2uud0/pics/LXTyzk2uud0912512.jpg'}, {'end': 1063.832, 'src': 'embed', 'start': 1011.967, 'weight': 2, 'content': [{'end': 1014.47, 'text': 'So events key in that resolver object.', 'start': 1011.967, 'duration': 2.503}, {'end': 1017.113, 'text': "And it's the same for this mutation.", 'start': 1014.931, 'duration': 2.182}, {'end': 1022.836, 'text': "Important, of course, you should name your queries and mutations such that they don't clash.", 'start': 1017.834, 'duration': 5.002}, {'end': 1025.738, 'text': 'GraphQL has no namespaces and so on.', 'start': 1023.297, 'duration': 2.441}, {'end': 1028.059, 'text': 'So each name here really is unique.', 'start': 1026.078, 'duration': 1.981}, {'end': 1030.38, 'text': 'Events here matches events here.', 'start': 1028.459, 'duration': 1.921}, {'end': 1037.55, 'text': 'Now with that, how does a resolver look like? Well, a resolver is really just a function.', 'start': 1031.986, 'duration': 5.564}, {'end': 1042.233, 'text': 'So events here is a function in this resolver object.', 'start': 1038.131, 'duration': 4.102}, {'end': 1044.695, 'text': "And I'm just assigning an anonymous arrow function here.", 'start': 1042.374, 'duration': 2.321}, {'end': 1047.719, 'text': 'This is how a resolver looks like.', 'start': 1045.717, 'duration': 2.002}, {'end': 1056.806, 'text': 'This function will be called for you by the express GraphQL package in the end, when an incoming request looks for this events property.', 'start': 1047.939, 'duration': 8.867}, {'end': 1059.908, 'text': 'So when an incoming request requests this events property.', 'start': 1056.826, 'duration': 3.082}, {'end': 1063.832, 'text': 'so here we just want to return our list of events.', 'start': 1060.929, 'duration': 2.903}], 'summary': 'Resolvers are unique functions for queries and mutations, called by express graphql package to return requested data.', 'duration': 51.865, 'max_score': 1011.967, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/LXTyzk2uud0/pics/LXTyzk2uud01011967.jpg'}], 'start': 891.265, 'title': 'Graphql essentials', 'summary': 'Covers the creation of graphql queries and mutations, emphasizing the necessity of defining commands and properties for the root query and root mutation to support the api. it also discusses resolvers in graphql, demonstrating their creation, testing, and handling of arguments.', 'chapters': [{'end': 981.412, 'start': 891.265, 'title': 'Graphql queries and mutations', 'summary': 'Discusses the creation of graphql queries and mutations, emphasizing the necessity of defining commands and properties for the root query and root mutation to support the api, with an explanation of the expected input and output for a mutation, and the indication that further logic is needed to act on incoming requests.', 'duration': 90.147, 'highlights': ['The necessity of defining commands and properties for the root query and root mutation to support the API, with an explanation of the expected input and output for a mutation.', 'Emphasizing the creation of GraphQL queries and mutations, with the indication that further logic is needed to act on incoming requests.', "Clarification on the naming convention for mutations, using the example of creating an event and naming the mutation as 'createEvent' to reflect the action.", 'Explanation of the expected input and output for a mutation, specifying the value and type of the input, as well as the return type.']}, {'end': 1274.348, 'start': 982.513, 'title': 'Graphql resolvers and api testing', 'summary': 'Explains the usage of resolvers in graphql, emphasizing the need for matching names for commands like events and create event, and demonstrates the creation and testing of resolvers for queries and mutations, including handling of arguments and api testing options.', 'duration': 291.835, 'highlights': ['The importance of matching names for resolvers for commands like events and create event is emphasized, ensuring they have exact same names and do not clash, as GraphQL has no namespaces. Resolvers for commands like events and create event need to have exact same names to avoid clashes, as GraphQL has no namespaces.', 'The chapter demonstrates the creation of a resolver function for events, returning a list of events (e.g., romantic cooking, sailing, all night coding) in the absence of a database. Creation of a resolver function for events, returning a list of events like romantic cooking, sailing, and all night coding in the absence of a database.', 'The process of creating a resolver for createEvent is detailed, including the handling of arguments using the args object and the return of the event name. Creation of a resolver for createEvent, detailing the handling of arguments using the args object and the return of the event name.', 'The options for API testing, including sending a post request with a valid GraphQL statement and utilizing the built-in debugging and development tool provided by express-graphql, are explained. Explanation of API testing options, including sending a post request with a valid GraphQL statement and utilizing the built-in debugging and development tool provided by express-graphql.']}], 'duration': 383.083, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/LXTyzk2uud0/pics/LXTyzk2uud0891265.jpg', 'highlights': ['Emphasizing the necessity of defining commands and properties for the root query and root mutation to support the API, with an explanation of the expected input and output for a mutation.', "Clarification on the naming convention for mutations, using the example of creating an event and naming the mutation as 'createEvent' to reflect the action.", 'The importance of matching names for resolvers for commands like events and create event is emphasized, ensuring they have exact same names and do not clash, as GraphQL has no namespaces.', 'The process of creating a resolver for createEvent is detailed, including the handling of arguments using the args object and the return of the event name.']}, {'end': 1494.479, 'segs': [{'end': 1316.645, 'src': 'embed', 'start': 1274.348, 'weight': 0, 'content': [{'end': 1281.991, 'text': "let's visit slash graphql and you will get this nice graphical user interface here where you can play around with your api,", 'start': 1274.348, 'duration': 7.643}, {'end': 1284.712, 'text': 'and the nice thing is that you even get auto completion here.', 'start': 1281.991, 'duration': 2.721}, {'end': 1286.612, 'text': 'how is auto completion achieved?', 'start': 1284.712, 'duration': 1.9}, {'end': 1295.576, 'text': 'well, it fetches metadata about your api behind the scenes and since graphical is a typed language, it knows perfectly well which type of data,', 'start': 1286.612, 'duration': 8.964}, {'end': 1298.437, 'text': 'for example, the create event query expects.', 'start': 1295.576, 'duration': 2.861}, {'end': 1301.998, 'text': 'so here, how do we write a query now?', 'start': 1299.537, 'duration': 2.461}, {'end': 1310.883, 'text': 'well, first of all you have to define which kind of query you want to create a normal query which fetches data or a mutation which mutates something.', 'start': 1301.998, 'duration': 8.885}, {'end': 1312.623, 'text': 'these are the two keywords we have here.', 'start': 1310.883, 'duration': 1.74}, {'end': 1314.905, 'text': 'we also have subscription and fragment.', 'start': 1312.623, 'duration': 2.282}, {'end': 1316.645, 'text': "uh, we'll not take care about these two.", 'start': 1314.905, 'duration': 1.74}], 'summary': "Graphql's graphical user interface offers auto completion and supports query types like normal, mutation.", 'duration': 42.297, 'max_score': 1274.348, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/LXTyzk2uud0/pics/LXTyzk2uud01274348.jpg'}, {'end': 1427.301, 'src': 'embed', 'start': 1383.376, 'weight': 3, 'content': [{'end': 1391.458, 'text': 'hit enter, and indeed we get back this object with the data key, which holds an object with the key of our action of our query events.', 'start': 1383.376, 'duration': 8.082}, {'end': 1393.719, 'text': 'And then this has the return value.', 'start': 1391.999, 'duration': 1.72}, {'end': 1396.96, 'text': 'And if this return value would be a nested object,', 'start': 1394.139, 'duration': 2.821}, {'end': 1403.522, 'text': 'then we could even dive into this with another pair of curly braces here and pick the fields we want to have.', 'start': 1396.96, 'duration': 6.562}, {'end': 1404.863, 'text': "And that is something we'll do later.", 'start': 1403.742, 'duration': 1.121}, {'end': 1409.084, 'text': "For now, let's stick with the simple example, which proves that the API works.", 'start': 1405.043, 'duration': 4.041}, {'end': 1411.675, 'text': "Now let's also see a mutation action.", 'start': 1410.134, 'duration': 1.541}, {'end': 1417.297, 'text': 'So mutation, we could give this a name too, but I will make it an anonymous mutation here.', 'start': 1412.355, 'duration': 4.942}, {'end': 1420.999, 'text': 'Hit control space here again for auto-completion.', 'start': 1418.077, 'duration': 2.922}, {'end': 1423.5, 'text': 'We only have to create event mutations.', 'start': 1421.259, 'duration': 2.241}, {'end': 1425.441, 'text': 'So this is filled in automatically.', 'start': 1423.52, 'duration': 1.921}, {'end': 1427.301, 'text': 'And this now takes arguments.', 'start': 1426.001, 'duration': 1.3}], 'summary': 'Testing api with basic object retrieval and mutation actions.', 'duration': 43.925, 'max_score': 1383.376, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/LXTyzk2uud0/pics/LXTyzk2uud01383376.jpg'}, {'end': 1494.479, 'src': 'embed', 'start': 1479.825, 'weight': 5, 'content': [{'end': 1485.21, 'text': "obviously we'll enhance this and make this more useful over the next videos in this series.", 'start': 1479.825, 'duration': 5.385}, {'end': 1489.314, 'text': 'But this already is a nice start that hopefully is interesting to you, too.', 'start': 1485.591, 'duration': 3.723}, {'end': 1492.797, 'text': 'So I hope to see you back in the next videos of the series.', 'start': 1489.734, 'duration': 3.063}, {'end': 1493.798, 'text': 'Have a great day.', 'start': 1493.138, 'duration': 0.66}, {'end': 1494.479, 'text': 'Bye.', 'start': 1494.259, 'duration': 0.22}], 'summary': 'Series will be enhanced for usefulness in future videos.', 'duration': 14.654, 'max_score': 1479.825, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/LXTyzk2uud0/pics/LXTyzk2uud01479825.jpg'}], 'start': 1274.348, 'title': 'Graphql api operations', 'summary': 'Explains using graphql interface for operations, including auto-completion, syntax for queries and mutations, accessing and requesting data, and creating a basic graphql api with examples and promises for enhancements in the upcoming videos.', 'chapters': [{'end': 1366.223, 'start': 1274.348, 'title': 'Graphql api operations overview', 'summary': 'Explains how to use the graphical interface for graphql, including the auto-completion feature based on metadata and the syntax for defining queries and mutations, with emphasis on the main types of operations and their respective functionalities.', 'duration': 91.875, 'highlights': ['The graphical interface provides auto-completion for API queries based on metadata, supporting efficient query creation. The graphical interface offers auto-completion based on API metadata, enhancing query creation efficiency.', 'The chapter provides insights into the syntax for defining queries and mutations, highlighting the main types of operations and their functionalities. The chapter explains the syntax for defining queries and mutations, emphasizing the main types of operations and their respective functionalities.', 'The main types of operations in GraphQL are queries for data retrieval and mutations for data manipulation. GraphQL encompasses queries for data retrieval and mutations for data manipulation as the main types of operations.']}, {'end': 1404.863, 'start': 1367.349, 'title': 'Accessing and requesting data', 'summary': 'Explains how to access and request data by hitting events, defining properties, and retrieving nested objects with examples.', 'duration': 37.514, 'highlights': ['By hitting events and defining properties, we can request events and receive an object with the data key holding the return value.', 'If the return value is a nested object, we can further retrieve specific fields by diving into it with another pair of curly braces.']}, {'end': 1494.479, 'start': 1405.043, 'title': 'Basic graphql api example', 'summary': 'Demonstrates the creation of a basic graphql api with a simple example and a mutation action, showcasing the process of defining arguments and executing the mutation, with the promise of further enhancements in the upcoming videos.', 'duration': 89.436, 'highlights': ['The chapter provides a demonstration of creating a basic GraphQL API with a simple example and a mutation action, showcasing the process of defining arguments and executing the mutation.', 'The example includes defining a mutation with an argument of type string, which, when executed, returns the specified value without errors.', 'The speaker expresses the intention to enhance and make the GraphQL API more useful in the upcoming videos of the series.']}], 'duration': 220.131, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/LXTyzk2uud0/pics/LXTyzk2uud01274348.jpg', 'highlights': ['The graphical interface provides auto-completion for API queries based on metadata, supporting efficient query creation.', 'The chapter explains the syntax for defining queries and mutations, emphasizing the main types of operations and their respective functionalities.', 'GraphQL encompasses queries for data retrieval and mutations for data manipulation as the main types of operations.', 'By hitting events and defining properties, we can request events and receive an object with the data key holding the return value.', 'The chapter provides a demonstration of creating a basic GraphQL API with a simple example and a mutation action, showcasing the process of defining arguments and executing the mutation.', 'The speaker expresses the intention to enhance and make the GraphQL API more useful in the upcoming videos of the series.']}], 'highlights': ['Series covers implementing a graphql api in node express, setting up graphql environment and request handling, creating graphql schema and resolvers, essentials of graphql queries and mutations, and using graphql interface for operations, with a focus on practical application and examples for a complete app.', 'Consolidating all requests into one endpoint for improved efficiency and maintainability', 'The graphical interface provides auto-completion for API queries based on metadata, supporting efficient query creation.', 'The chapter provides a demonstration of creating a basic GraphQL API with a simple example and a mutation action, showcasing the process of defining arguments and executing the mutation.', 'Emphasizing the necessity of defining commands and properties for the root query and root mutation to support the API, with an explanation of the expected input and output for a mutation.']}