1 00:00:00,660 --> 00:00:06,300 A lot of section we spoke about refactoring from traditional promises over to using the improved async 2 00:00:06,350 --> 00:00:07,670 await syntax. 3 00:00:07,710 --> 00:00:12,330 Let's now apply all that knowledge to our callback function inside of the passport. 4 00:00:12,530 --> 00:00:13,170 Fine. 5 00:00:13,440 --> 00:00:19,650 So as a reminder I'm inside of services passports Geass and I'm looking at the second argument to the 6 00:00:19,650 --> 00:00:21,290 Google strategy. 7 00:00:21,600 --> 00:00:27,390 Now at present we have our aero function right here and we've got two different promises and here one 8 00:00:27,390 --> 00:00:33,060 is being used to make a query to the database to find an existing user with a given Google ID and then 9 00:00:33,060 --> 00:00:37,410 the second is being used to create and save a new user to the database. 10 00:00:37,410 --> 00:00:43,440 So remember any time we touch our database that is an asynchronous interaction it always returns a promise 11 00:00:43,500 --> 00:00:46,350 and we have to deal with the promise appropriately. 12 00:00:46,350 --> 00:00:52,440 So I want to say that we are going to really factor this function to use the async syntax rather than 13 00:00:52,440 --> 00:00:54,920 the promises that it is using right now. 14 00:00:55,530 --> 00:01:01,530 Now as we do this refactor we're going to do it somewhat quickly and I want you to really triple check 15 00:01:01,560 --> 00:01:02,290 your code. 16 00:01:02,400 --> 00:01:07,110 Make sure you've got the same code as I make sure that you don't have any typos because of course any 17 00:01:07,110 --> 00:01:11,300 typos is going to lead to an error when you try to test this code out. 18 00:01:11,430 --> 00:01:13,200 So let's do the refactor. 19 00:01:13,200 --> 00:01:16,880 Let's follow the few steps that we have to go through every time we do it. 20 00:01:16,890 --> 00:01:22,570 First off we're going to identify the function that contains some amount of asynchronous code. 21 00:01:22,860 --> 00:01:25,360 And so I'm looking at the arrow function. 22 00:01:25,420 --> 00:01:28,670 And looking at the arrow function right here. 23 00:01:28,830 --> 00:01:32,790 This is the function that contains some asynchronous code. 24 00:01:32,790 --> 00:01:38,150 So I'm going to mark the function as a B as being a synchronous nature. 25 00:01:38,190 --> 00:01:45,900 So right before the argument list a place the async keyword next will identify all the different promises 26 00:01:45,900 --> 00:01:48,480 that are being created inside the function. 27 00:01:48,510 --> 00:01:51,760 I see one promise being created right here. 28 00:01:51,840 --> 00:01:57,780 So when we do the find one request I see a second promise being created right here when we call save 29 00:01:57,840 --> 00:02:00,690 on the newly created user. 30 00:02:00,690 --> 00:02:06,120 So we're going to start off by putting the a weight keyword in front of each of these requests. 31 00:02:06,120 --> 00:02:08,010 Or each of these promises. 32 00:02:08,250 --> 00:02:16,540 So I will say a weight user not find one and await new user save. 33 00:02:16,560 --> 00:02:22,020 Next we're going to do a little bit of new lining and indentation to remove all the then statements 34 00:02:22,020 --> 00:02:26,060 that we have going to find the first dot then appear. 35 00:02:26,160 --> 00:02:29,270 I'm going to put a new line right before it. 36 00:02:30,680 --> 00:02:38,020 Notice how when the promise is resolved we assign the return value to a variable called existing user. 37 00:02:38,060 --> 00:02:44,360 So rather than receiving existing user as a new argument or an argument to this function we will assign 38 00:02:44,450 --> 00:02:49,590 the result of a weight user defined one to a variable with an identical name. 39 00:02:49,640 --> 00:02:53,750 So I will say Konst existing user equals a wait. 40 00:02:53,770 --> 00:02:58,230 Wa wa wa like so we will then clean up the then statement. 41 00:03:00,930 --> 00:03:07,710 I will clean up the closing braces down here that we're matching up to that then statement. 42 00:03:07,710 --> 00:03:15,210 So make sure you find the curly brace parentheses like so clean them up and then we will indent the 43 00:03:15,240 --> 00:03:18,850 remaining logic like so. 44 00:03:18,870 --> 00:03:22,210 So now everything is on the same line. 45 00:03:22,260 --> 00:03:24,980 Now at this point we should be able to save this file. 46 00:03:25,050 --> 00:03:28,620 And if you are using prettier it should not result in any type of error. 47 00:03:28,620 --> 00:03:32,850 So if I save the file I just saved it and I didn't get any air from prettier. 48 00:03:32,850 --> 00:03:34,710 So if you're using prettier. 49 00:03:34,770 --> 00:03:39,900 Good time to save the file or run prettier and just make sure that you don't have any syntax errors 50 00:03:39,900 --> 00:03:41,520 inside of here. 51 00:03:41,520 --> 00:03:45,510 So now we're going to do our refactor for the second promise inside of here. 52 00:03:45,990 --> 00:03:48,410 So here's awaits new user. 53 00:03:48,510 --> 00:03:55,110 I'm going to put the dots save on the same line as the new user creation and other all in the same line 54 00:03:55,950 --> 00:04:02,520 and then going to find the then statement I'm going to say rather than allowing the new user to be or 55 00:04:02,520 --> 00:04:08,490 the newly created user to be assigned to this variable user inside the callback function I will assign 56 00:04:08,490 --> 00:04:10,570 it outside of it. 57 00:04:10,590 --> 00:04:15,610 So I'll say Konst user equals a new user save. 58 00:04:16,770 --> 00:04:22,920 And then we are going to delete the entire dot then line and make sure that we bring over the dun call 59 00:04:22,920 --> 00:04:23,510 as well. 60 00:04:23,670 --> 00:04:32,110 So I'll say delete that thing and the we'll still call done with no end user like so. 61 00:04:32,640 --> 00:04:34,710 OK so I'm now going to save this file again. 62 00:04:34,710 --> 00:04:38,670 Again I should not have any errors or any syntax errors at this point in time. 63 00:04:38,790 --> 00:04:40,910 So everything in here is looking pretty good. 64 00:04:41,520 --> 00:04:47,940 I should be able to flip back over to my terminal and if I review my running server I should still see 65 00:04:47,940 --> 00:04:49,220 like everything is running. 66 00:04:49,320 --> 00:04:53,880 Yes I know we've got the deprecation warnings but I should not see any messages saying oh hey you have 67 00:04:53,880 --> 00:04:54,840 some air in here. 68 00:04:55,110 --> 00:05:01,860 Now at this point if you do see an error and you see something like oh unknown keyword async or something 69 00:05:01,860 --> 00:05:08,370 like that or unknown token I want you to triple check and make sure that you are running an up to date 70 00:05:08,370 --> 00:05:09,430 version of No. 71 00:05:09,530 --> 00:05:10,610 Yes. 72 00:05:10,650 --> 00:05:18,300 So if you open up a new tab or a new console window and run node dash Vi if you see anything earlier 73 00:05:18,330 --> 00:05:25,410 than version like 7.6 or so you do not have support for a single weight you are running an old version 74 00:05:25,410 --> 00:05:26,140 of Node. 75 00:05:26,220 --> 00:05:30,720 And I remember the first thing that we didn't sign this course we updated our version of node and make 76 00:05:30,720 --> 00:05:34,010 sure that made sure that we were running at least version 8 or so. 77 00:05:34,320 --> 00:05:38,820 So if you're seeing an error over here that says something like Hey I don't know what the key word async 78 00:05:38,820 --> 00:05:39,680 means. 79 00:05:39,720 --> 00:05:44,580 That means you probably have an old out version or out of date version of node and you need to make 80 00:05:44,580 --> 00:05:50,800 sure that you update it because you will not get support for async wait until you update your version. 81 00:05:50,820 --> 00:05:55,350 So if you need to update note if you're seeing that error message go back to the very first lecture 82 00:05:55,350 --> 00:05:56,130 in this course. 83 00:05:56,130 --> 00:06:01,220 Make sure you update your version of note and you have at least a point 1.1. 84 00:06:02,010 --> 00:06:08,460 OK so now back over at our code we can look at our function now and visually it looks a lot simpler 85 00:06:08,490 --> 00:06:13,350 and a lot more straightforward than what we had before we can even do a little bit more of a refactor 86 00:06:13,350 --> 00:06:14,390 than we have right now. 87 00:06:14,400 --> 00:06:18,750 I'm gonna say that three factor I'm about to do is 100 percent optional but it's how I would personally 88 00:06:18,750 --> 00:06:22,110 write this code out as this give me an optional Nery factor. 89 00:06:22,100 --> 00:06:25,580 This is going to be what I would personally do inside of here. 90 00:06:25,590 --> 00:06:28,050 You'll notice that we have if existing user. 91 00:06:28,080 --> 00:06:32,070 And then the Elle's case right here we don't really need the L's case here. 92 00:06:32,070 --> 00:06:35,900 If we make sure that we return when we hit this block. 93 00:06:36,210 --> 00:06:41,700 So if I add the return keyword in front of done right here that will make sure that if we have an existing 94 00:06:41,700 --> 00:06:45,060 user we will not run anything else inside the function. 95 00:06:45,090 --> 00:06:50,870 And so then I can remove the Ell's case of the if statement. 96 00:06:50,910 --> 00:06:55,690 Of course we still want the logic in there we just don't need the actual explicit else. 97 00:06:55,760 --> 00:07:00,750 And so when we remove that thanks to the done or return key word right here everything inside of here 98 00:07:00,780 --> 00:07:03,270 now gets even more straightforward than before. 99 00:07:03,270 --> 00:07:10,710 And if I want to really clean things up I would even remove the comments and now wow this is remarkably 100 00:07:10,770 --> 00:07:16,060 more Surt straightforward and remarkably more simple than what we had before. 101 00:07:16,110 --> 00:07:17,180 So that's pretty much it. 102 00:07:17,190 --> 00:07:19,550 That is the async await syntax. 103 00:07:19,560 --> 00:07:24,210 Again we're going to use it throughout the rest of this course one or two times we might write out some 104 00:07:24,210 --> 00:07:30,320 code using promises but then we'll refactor it immediately over to use the async await stuff instead. 105 00:07:30,330 --> 00:07:33,000 So I hope that is a little bit more clear what's going on here. 106 00:07:33,150 --> 00:07:38,330 Let's now continue inside the next section and continue developing the front end of our application.