1 00:00:00,240 --> 00:00:06,510 In this video now that we have a sense of familiarity with the async await syntax it's time to put it 2 00:00:06,510 --> 00:00:07,860 into practice. 3 00:00:07,860 --> 00:00:09,650 We're going to do a little work together. 4 00:00:09,720 --> 00:00:15,480 Then there'll be a challenge then a little more work and then a second challenge trying to give us some 5 00:00:15,480 --> 00:00:17,530 real hands on experience. 6 00:00:17,550 --> 00:00:19,580 So let's talk about where we're going to start. 7 00:00:19,740 --> 00:00:26,070 We're going to close all of our open files collapse the play ground directory and move back into Task 8 00:00:26,130 --> 00:00:27,150 Manager. 9 00:00:27,150 --> 00:00:32,610 Together we're going to convert promise chaining dot J asked to use async await. 10 00:00:32,730 --> 00:00:38,700 Then you'll do a challenge well you'll convert promise chaining to then we're actually going to move 11 00:00:38,700 --> 00:00:47,130 into index dot J S and use async await inside of the task manager API root handlers which I'm really 12 00:00:47,130 --> 00:00:52,680 excited to get to because it's gonna allow us to clean up the code pretty significantly. 13 00:00:52,800 --> 00:00:54,260 So to get things started. 14 00:00:54,270 --> 00:00:55,290 What are we going to do. 15 00:00:55,290 --> 00:01:01,380 Well right here we'll go ahead and kick things off by creating a new function that's going to be the 16 00:01:01,470 --> 00:01:02,670 async function. 17 00:01:02,670 --> 00:01:07,800 Remember to use a single wait we have to start with an async function. 18 00:01:07,800 --> 00:01:15,970 So right here I can call this something like update age and count describing what it's doing I will 19 00:01:15,970 --> 00:01:18,250 then set it up as an async function. 20 00:01:18,250 --> 00:01:21,010 And right here I'll use an arrow function. 21 00:01:21,010 --> 00:01:27,340 Now using async isn't limited to Arrow functions I could use it with standard functions or with the 22 00:01:27,350 --> 00:01:33,370 E6 method definition syntax if I was defining a method on an object. 23 00:01:33,460 --> 00:01:39,010 Right here though let's go ahead and actually get done what we need to get done now for this one we 24 00:01:39,010 --> 00:01:47,080 do need to accept some input that is going to be the I.D. of the user we're updating and we're also 25 00:01:47,080 --> 00:01:54,760 going to accept the age they want to change to down below we'll use those two pieces of input to go 26 00:01:54,760 --> 00:02:01,960 through the process now we're working with two methods that return promises find by I.D. and update 27 00:02:02,050 --> 00:02:05,800 and count documents and we'll be using a wait with both. 28 00:02:05,800 --> 00:02:09,580 The first thing we're going to do is call find by I.D. and update. 29 00:02:09,580 --> 00:02:16,720 So right here I'll create const user and I'll get its value from awaiting the following promise. 30 00:02:16,720 --> 00:02:27,280 User dot find by I.D. and update and we'll pass that I.D. in right here that is the parameter from up 31 00:02:27,280 --> 00:02:27,660 above. 32 00:02:27,670 --> 00:02:30,510 So we're just going to pass it through to the function. 33 00:02:30,520 --> 00:02:34,300 Now we also want to provide the updates we're trying to apply. 34 00:02:34,300 --> 00:02:40,250 So we'll have our object right here where we set age equal to the new age like zero. 35 00:02:40,360 --> 00:02:45,150 In this case we have a variable called Age from up above which we're gonna use. 36 00:02:45,310 --> 00:02:51,760 And since we're setting the property to a value that comes from a variable of the same name we can just 37 00:02:51,760 --> 00:02:55,870 use that shorthand we explored earlier in the class. 38 00:02:55,900 --> 00:02:59,170 So right here we have our first call all done. 39 00:02:59,170 --> 00:03:03,130 And now we can move on to the second one where we get the count. 40 00:03:03,210 --> 00:03:12,350 I am going to await the following user dot count documents and here we are looking for documents where 41 00:03:12,410 --> 00:03:15,890 age equals the value passed in for age. 42 00:03:15,890 --> 00:03:18,130 So once again taking advantage of that. 43 00:03:18,130 --> 00:03:21,050 Yes 6 syntax like we did up above. 44 00:03:21,050 --> 00:03:26,630 Now we have access to both the user end of the account and we can choose to return whatever we want 45 00:03:26,630 --> 00:03:27,260 to. 46 00:03:27,290 --> 00:03:33,830 I could return an object adding both of these on as properties if I wanted to access both of them or 47 00:03:33,830 --> 00:03:38,810 I could return an individual one such as returning count right here. 48 00:03:38,810 --> 00:03:42,340 So at this point we can now go ahead and use our function. 49 00:03:42,380 --> 00:03:45,530 And that's exactly what I'm going to do down below. 50 00:03:45,530 --> 00:03:51,540 Update age and count I will provide those two arguments. 51 00:03:51,650 --> 00:03:57,770 I'll copy the I.D. from up above pasting that in and then I'll pick a new age. 52 00:03:57,770 --> 00:04:00,290 I'll bring that person from 1 to 2. 53 00:04:00,770 --> 00:04:06,480 So right here we now have the exact same functionality set up using async await. 54 00:04:06,590 --> 00:04:12,530 We can also go ahead and add on then and catch to handle any potential errors or to do something with 55 00:04:12,530 --> 00:04:13,480 the result. 56 00:04:13,580 --> 00:04:17,700 Right here I'm going to get access to the count now. 57 00:04:17,800 --> 00:04:23,050 This could be called anything I want but I'm calling it count because I know it's going to be the count 58 00:04:23,110 --> 00:04:31,240 that's what gets returned from the async function right here console log printing count then I could 59 00:04:31,240 --> 00:04:32,890 set up catch down below. 60 00:04:32,980 --> 00:04:39,210 Doing the same thing getting our error and dumping it to the console console log e. 61 00:04:39,340 --> 00:04:40,430 Perfect. 62 00:04:40,480 --> 00:04:45,380 So now we have everything in place and we can go ahead and test our work. 63 00:04:45,430 --> 00:04:51,340 What I'm going to do is comment out the chaining example up above though I'll leave it in place and 64 00:04:51,340 --> 00:04:58,330 we are going to run the file testing that our user gets updated over inside of robo three T. 65 00:04:58,330 --> 00:05:04,600 I have my list of users right here in that first tab and if I refresh things I have a couple of users 66 00:05:04,600 --> 00:05:06,250 with the age of 1. 67 00:05:06,280 --> 00:05:08,900 Let's go ahead and run the script and see what we get. 68 00:05:09,030 --> 00:05:20,150 C D dot dot forward slash Task Manager and from here we're going to run the file that is node playground 69 00:05:21,540 --> 00:05:26,410 forward slash promise chaining dot J. 70 00:05:26,420 --> 00:05:30,750 S when I run the script we should see the output showing up. 71 00:05:30,780 --> 00:05:34,470 Right here I get my count one which is fantastic. 72 00:05:34,470 --> 00:05:40,980 Now that we have this in place we can go ahead and make sure that things did indeed update in the database. 73 00:05:40,980 --> 00:05:46,830 I'm going to move over to robo three ti refresh and right here the age is now 2. 74 00:05:46,830 --> 00:05:51,850 And the reason I'm seeing one is because only one user has that age. 75 00:05:52,140 --> 00:05:58,890 With this in place we have now used a sink and a wait to do something with Mongoose and this is the 76 00:05:58,890 --> 00:06:02,420 first of four things I wanted to do in the video. 77 00:06:02,490 --> 00:06:08,790 The second as mentioned is a challenge where you're going to use async await with the other example 78 00:06:09,000 --> 00:06:15,880 where we deleted a task by its I.D. and then figured out how many tasks we still needed to complete. 79 00:06:15,990 --> 00:06:18,390 Let's go ahead and talk about what I'd like you to do. 80 00:06:18,450 --> 00:06:21,570 Right here there are a few steps for getting this one done. 81 00:06:21,600 --> 00:06:24,520 So the goal is to use async and no wait. 82 00:06:24,540 --> 00:06:31,080 You're going to create a new function and async function called delete task and count that's going to 83 00:06:31,080 --> 00:06:34,110 perform the two operations we have up above. 84 00:06:34,230 --> 00:06:40,080 You're going to accept the idea of the task to remove as the only parameter for the function and then 85 00:06:40,080 --> 00:06:47,480 the function body you're going to use a weight to delete the task and to count up the incomplete tasks. 86 00:06:47,490 --> 00:06:51,690 Now your new async function should return the count to the caller. 87 00:06:51,690 --> 00:06:58,080 And that brings us to the next step which is to call the function attaching then and catch like we did 88 00:06:58,230 --> 00:07:05,550 in the other example Last up test your work find a task to delete and make sure it actually gets removed 89 00:07:05,550 --> 00:07:06,630 correctly. 90 00:07:06,630 --> 00:07:12,900 Take some time to knock that out test your work and check the count for correctness when you're done 91 00:07:13,020 --> 00:07:14,610 come back and click play 92 00:07:18,600 --> 00:07:19,470 how'd that go. 93 00:07:19,470 --> 00:07:21,750 Let's go ahead and kick things off together. 94 00:07:21,780 --> 00:07:27,150 What I'm going to do up above is comment out the previous chaining example and focus on the new one 95 00:07:27,240 --> 00:07:29,860 by defining our function right here. 96 00:07:29,910 --> 00:07:35,220 So const delete task and count. 97 00:07:35,220 --> 00:07:40,710 Now we want to set this up as an async function so I can actually use a weight inside of it. 98 00:07:40,710 --> 00:07:46,890 I could use any type of function I wanted to hear I'll just use an arrow function inside of here. 99 00:07:46,890 --> 00:07:51,620 We want to make sure that we are accepting the I.D. of the task to delete. 100 00:07:51,780 --> 00:07:56,500 And the next thing to do is to perform those two operations we had up above. 101 00:07:56,580 --> 00:07:58,040 First is delete the task. 102 00:07:58,050 --> 00:08:05,060 Second is count up the incomplete tasks right here const task equals. 103 00:08:05,220 --> 00:08:07,550 We'll use a weight with the following promise. 104 00:08:07,560 --> 00:08:14,900 It's the one that comes back from calling task dot find by I.D. and delete. 105 00:08:15,120 --> 00:08:20,180 And we're going to provide the I.D. which we have as the first parameter. 106 00:08:20,250 --> 00:08:22,640 So that is the first async operation. 107 00:08:22,660 --> 00:08:28,650 Now after that's done we're going to perform the second which is to get the count the incomplete task 108 00:08:28,710 --> 00:08:38,880 count right here once again using a wait with task dot count documents because count documents returns 109 00:08:39,000 --> 00:08:39,990 a promise. 110 00:08:40,110 --> 00:08:45,450 If these methods didn't return a promise we wouldn't be able to use them with a wait. 111 00:08:45,450 --> 00:08:48,110 Now what do we want to provide to account documents. 112 00:08:48,180 --> 00:08:50,120 Just our filtering criteria. 113 00:08:50,190 --> 00:08:54,590 I only want to count documents where completed is equal to False. 114 00:08:54,600 --> 00:08:57,810 I don't want to count those completed tasks. 115 00:08:57,810 --> 00:09:02,370 Next up on the list we want to make sure to return something meaningful and right here. 116 00:09:02,370 --> 00:09:04,290 I'll just return the count. 117 00:09:04,290 --> 00:09:07,810 Now it's time to actually put this to use down below. 118 00:09:07,830 --> 00:09:09,300 I'm going to do just that. 119 00:09:09,300 --> 00:09:12,600 Now I do need the idea of a task to remove. 120 00:09:12,630 --> 00:09:14,740 So over in robo 3 T. 121 00:09:15,000 --> 00:09:17,750 I'll head back over to the tasks tab. 122 00:09:17,880 --> 00:09:25,380 If I refresh things I have just to I'm going to go ahead and delete the second one I'll edit the document 123 00:09:25,710 --> 00:09:30,760 just to grab its I.D. and I'll bring that I.D. over to visual studio code. 124 00:09:30,870 --> 00:09:37,180 From here we can now call the function delete task and count. 125 00:09:37,180 --> 00:09:43,570 I'm going to provide that I.D. as the first and only argument and then I can set up my then call where 126 00:09:43,570 --> 00:09:48,370 I get access to that count and I can also console dialog it 127 00:09:51,260 --> 00:09:57,000 and finally we'll go ahead and setup a catch call where we get access to the error and right here we'll 128 00:09:57,000 --> 00:09:58,860 log that as well. 129 00:09:58,860 --> 00:09:59,940 Perfect. 130 00:09:59,940 --> 00:10:05,760 With this in place we can remove the challenge comments and actually test things out to make sure that 131 00:10:05,760 --> 00:10:10,100 the new code works exactly as the old example did. 132 00:10:10,110 --> 00:10:10,970 Now you'll notice. 133 00:10:11,010 --> 00:10:15,250 Well we do indeed get a value back from find my I.D. and delete. 134 00:10:15,270 --> 00:10:16,670 We're not actually using it. 135 00:10:16,800 --> 00:10:19,990 If we wanted to I could have just the following. 136 00:10:20,010 --> 00:10:23,700 This is also perfectly valid and would function the same way. 137 00:10:23,700 --> 00:10:29,250 The only advantage of actually storing the result in a variable is that I could use it if I needed to. 138 00:10:29,250 --> 00:10:33,540 In this case though I happen to not need the task I got deleted. 139 00:10:33,690 --> 00:10:37,100 I'm going to save the program and run things from the terminal right here. 140 00:10:37,110 --> 00:10:44,590 That would be node playground forward slash promise chaining that's number two. 141 00:10:44,600 --> 00:10:48,690 Dot J S so I'm gonna take a quick moment to run this. 142 00:10:48,750 --> 00:10:56,470 I can see my count of 1 printing and if I refresh things over in robo 3 T I can see my 1 task was deleted. 143 00:10:56,580 --> 00:11:00,390 And the reason I'm getting one is because I have just one left. 144 00:11:00,390 --> 00:11:01,710 So there we go. 145 00:11:01,740 --> 00:11:06,450 We've used async await together and you've now used it on your own. 146 00:11:06,450 --> 00:11:12,570 Now this example does indeed use those Mongoose methods but it's not exactly part of our task manager 147 00:11:12,600 --> 00:11:13,780 application. 148 00:11:13,860 --> 00:11:17,490 So what we're going to do is shut things down from the terminal. 149 00:11:17,520 --> 00:11:22,100 Clear the terminal output and we're going to close down both of these files. 150 00:11:22,140 --> 00:11:27,930 We used them to get comfortable with the syntax but what I really want to do is explore how this is 151 00:11:27,930 --> 00:11:35,110 gonna help us build out the task manager rest api and create code that's easy to write and maintain. 152 00:11:35,610 --> 00:11:39,840 So in index dot J J.S. we already have a bunch of different routes. 153 00:11:39,900 --> 00:11:45,690 These are our various predefined operations and all of them are doing something a synchronous and you 154 00:11:45,690 --> 00:11:48,340 can see that in every single one of them. 155 00:11:48,390 --> 00:11:55,020 We have calls to then and catch to do something with the promise whether it's fulfilled or rejected 156 00:11:55,350 --> 00:12:03,330 but we can actually do is make all of our root handlers these functions a sync and then we can use async 157 00:12:03,390 --> 00:12:07,850 await inside of them to create code that looks a bit more synchronous. 158 00:12:07,860 --> 00:12:12,480 I wanted to cover that in this lesson but to keep these lessons at a reasonable length I'm going to 159 00:12:12,480 --> 00:12:14,550 push that off to the next one. 160 00:12:14,580 --> 00:12:17,070 So if you do have time go ahead and jump right in. 161 00:12:17,070 --> 00:12:20,550 Otherwise watch that lesson the next time you get a chance.