1 00:00:01,700 --> 00:00:03,750 ‫Before moving on to the next section 2 00:00:03,750 --> 00:00:06,860 ‫and mongoDB, I want to show you how to setup 3 00:00:06,860 --> 00:00:10,230 ‫eslint together with prettier in vs code 4 00:00:10,230 --> 00:00:13,090 ‫in order to improve our code quality. 5 00:00:13,090 --> 00:00:15,360 ‫Now if you're not using vs code, 6 00:00:15,360 --> 00:00:18,110 ‫or if you already have some kind of linter 7 00:00:18,110 --> 00:00:22,150 ‫in your workflow, then please mark this lecture as completed 8 00:00:22,150 --> 00:00:24,810 ‫and move on right to the next section. 9 00:00:24,810 --> 00:00:26,890 ‫But if you're new to es Lint, 10 00:00:26,890 --> 00:00:29,150 ‫and want to improve your code quality, 11 00:00:29,150 --> 00:00:31,543 ‫then let's get started with this video. 12 00:00:33,210 --> 00:00:36,210 ‫So es Lint is basically a program 13 00:00:36,210 --> 00:00:38,470 ‫that constantly scans our code 14 00:00:38,470 --> 00:00:40,640 ‫and finds potential coding errors 15 00:00:40,640 --> 00:00:45,130 ‫or simply bad coding practices that it thinks are wrong. 16 00:00:45,130 --> 00:00:47,730 ‫It's very, very configurable so that 17 00:00:47,730 --> 00:00:50,300 ‫we can really fine tune it to our needs, 18 00:00:50,300 --> 00:00:52,130 ‫and coding habits. 19 00:00:52,130 --> 00:00:55,740 ‫Now we can also use es Lint for code formatting, 20 00:00:55,740 --> 00:00:57,700 ‫but we will continue using prettier 21 00:00:57,700 --> 00:01:00,610 ‫that we already setup earlier for that. 22 00:01:00,610 --> 00:01:02,526 ‫So we will set up this entire thing 23 00:01:02,526 --> 00:01:06,240 ‫so that prettier is still the main code formatter 24 00:01:06,240 --> 00:01:08,730 ‫but based on some es Lint rules 25 00:01:08,730 --> 00:01:10,130 ‫that we will define. 26 00:01:10,130 --> 00:01:12,670 ‫And so all that es Lint will do for us 27 00:01:12,670 --> 00:01:14,780 ‫is to highlight the errors. 28 00:01:14,780 --> 00:01:16,520 ‫But I know that all this probably 29 00:01:16,520 --> 00:01:19,290 ‫sounds more confusing than anything else. 30 00:01:19,290 --> 00:01:22,700 ‫And so let's actually set this up now. 31 00:01:22,700 --> 00:01:24,550 ‫So the first thing that I want you to do 32 00:01:24,550 --> 00:01:27,893 ‫is to install the es Lint extension for vs Code. 33 00:01:29,100 --> 00:01:33,160 ‫So come over here, and search for es Lint. 34 00:01:33,160 --> 00:01:33,993 ‫Okay? 35 00:01:33,993 --> 00:01:35,340 ‫And I already have it installed, 36 00:01:35,340 --> 00:01:36,760 ‫but it looks like this. 37 00:01:36,760 --> 00:01:38,890 ‫And so all you need to do is to go ahead 38 00:01:38,890 --> 00:01:42,870 ‫and install it, and then probably reload this window. 39 00:01:42,870 --> 00:01:45,350 ‫And if you don't have Prettier set up yet 40 00:01:45,350 --> 00:01:47,343 ‫then go ahead and do that one as well. 41 00:01:49,260 --> 00:01:50,790 ‫So with this extension here, 42 00:01:50,790 --> 00:01:52,540 ‫but this one we actually already did 43 00:01:52,540 --> 00:01:55,473 ‫in the first section if you followed that with me. 44 00:01:56,480 --> 00:01:59,880 ‫Next up, we need to install a bunch of dev dependencies 45 00:02:01,100 --> 00:02:04,125 ‫so let's actually make this here a lot bigger 46 00:02:04,125 --> 00:02:06,930 ‫and go to our other terminal here. 47 00:02:06,930 --> 00:02:11,060 ‫And so let's say, npm install and we need to 48 00:02:11,060 --> 00:02:14,633 ‫also install es Lint in prettier as npm packages. 49 00:02:16,280 --> 00:02:17,113 ‫Okay? 50 00:02:18,210 --> 00:02:20,060 ‫So es Lint and prettier, 51 00:02:20,060 --> 00:02:22,010 ‫and probably this is now the first time 52 00:02:22,010 --> 00:02:23,630 ‫where we are actually installing 53 00:02:23,630 --> 00:02:26,030 ‫multiple packages at the same time. 54 00:02:26,030 --> 00:02:28,820 ‫And so that's very easy, we simply write 55 00:02:28,820 --> 00:02:31,550 ‫all these packages all in the same command. 56 00:02:31,550 --> 00:02:32,383 ‫Okay? 57 00:02:32,383 --> 00:02:35,440 ‫But with these two we are actually far from ready. 58 00:02:35,440 --> 00:02:38,420 ‫So the next one is es Lint config prettier 59 00:02:43,721 --> 00:02:46,630 ‫and this one will disable formatting for es Lint, 60 00:02:46,630 --> 00:02:50,250 ‫because remember, we want prettier to format our code. 61 00:02:50,250 --> 00:02:52,860 ‫Next up we have es Lint plugin prettier 62 00:02:57,130 --> 00:02:58,970 ‫and this one will allow es Lint 63 00:02:58,970 --> 00:03:01,710 ‫to show formatting errors as we type, 64 00:03:01,710 --> 00:03:03,770 ‫again, using prettier. 65 00:03:03,770 --> 00:03:04,710 ‫Okay? 66 00:03:04,710 --> 00:03:07,460 ‫And all of this is of course, very confusing 67 00:03:07,460 --> 00:03:10,570 ‫and I needed a lot of time to figure this out. 68 00:03:10,570 --> 00:03:13,280 ‫And so this really is just a recipe 69 00:03:13,280 --> 00:03:14,880 ‫that you need to follow here. 70 00:03:14,880 --> 00:03:15,713 ‫Okay? 71 00:03:15,713 --> 00:03:17,360 ‫So it's not about understanding 72 00:03:17,360 --> 00:03:19,240 ‫what I'm doing here, all you need to do is 73 00:03:19,240 --> 00:03:21,340 ‫to follow this recipe, and it will 74 00:03:21,340 --> 00:03:24,230 ‫then work for this project, and in future projects 75 00:03:24,230 --> 00:03:26,140 ‫all you have to do is to go to your 76 00:03:26,140 --> 00:03:29,210 ‫package dot json file and copy that configuration 77 00:03:29,210 --> 00:03:31,750 ‫and install it in your next project. 78 00:03:31,750 --> 00:03:33,400 ‫Because actually, all of these packages 79 00:03:33,400 --> 00:03:35,270 ‫they have to be installed locally. 80 00:03:35,270 --> 00:03:37,180 ‫It would not work if we tried 81 00:03:37,180 --> 00:03:38,980 ‫to do this globally. 82 00:03:38,980 --> 00:03:39,960 ‫Alright? 83 00:03:39,960 --> 00:03:43,320 ‫Anyway, we need now some jobs good style guide 84 00:03:43,320 --> 00:03:44,530 ‫that we can follow. 85 00:03:44,530 --> 00:03:46,550 ‫And there are many style guides out there, 86 00:03:46,550 --> 00:03:47,930 ‫but the most popular one 87 00:03:47,930 --> 00:03:50,940 ‫is probably the airbnb style guide. 88 00:03:50,940 --> 00:03:53,950 ‫And so actually, there is an es Lint configuration 89 00:03:53,950 --> 00:03:57,350 ‫that we can use for that, which is on npm, 90 00:03:57,350 --> 00:04:02,300 ‫and it's called eslint config airbnb. 91 00:04:02,300 --> 00:04:07,300 ‫Okay, next up, we have eslint plugin node, 92 00:04:08,260 --> 00:04:11,710 ‫and this will add a couple of specific eslint rules 93 00:04:11,710 --> 00:04:13,840 ‫only for nodejs, okay? 94 00:04:13,840 --> 00:04:15,980 ‫So basically to find some errors 95 00:04:15,980 --> 00:04:19,450 ‫that we might be doing when writing nodejs code. 96 00:04:19,450 --> 00:04:23,020 ‫And now finally, we need three other eslint plugins 97 00:04:23,020 --> 00:04:25,920 ‫which are only necessary in order to make the airbnb 98 00:04:25,920 --> 00:04:27,850 ‫style guide actually work. 99 00:04:27,850 --> 00:04:30,980 ‫So that style guide, kind of depends on these. 100 00:04:30,980 --> 00:04:33,703 ‫So eslint plugin, 101 00:04:34,750 --> 00:04:35,583 ‫import, 102 00:04:37,350 --> 00:04:38,183 ‫eslint, 103 00:04:39,390 --> 00:04:40,223 ‫plugin, 104 00:04:42,520 --> 00:04:43,353 ‫jsx, 105 00:04:44,910 --> 00:04:46,450 ‫a11y, 106 00:04:46,450 --> 00:04:48,620 ‫and I see that I have a mistake here. 107 00:04:50,320 --> 00:04:51,433 ‫And finally eslint, 108 00:04:54,460 --> 00:04:55,460 ‫plugin, react. 109 00:04:55,460 --> 00:04:57,830 ‫Even though we're not writing in the react code here 110 00:04:57,830 --> 00:04:59,830 ‫we still need this one because the airbnb 111 00:04:59,830 --> 00:05:01,890 ‫style guide depends on it. 112 00:05:01,890 --> 00:05:04,300 ‫So these are all the packages, 113 00:05:04,300 --> 00:05:06,660 ‫I hope that I wrote them correctly. 114 00:05:06,660 --> 00:05:09,850 ‫And now we need to save these as dev dependencies, 115 00:05:09,850 --> 00:05:12,950 ‫so save dev and now hit return, 116 00:05:12,950 --> 00:05:17,950 ‫and cross your fingers that everything's gonna work here. 117 00:05:18,550 --> 00:05:20,600 ‫So, it seems like it did. 118 00:05:20,600 --> 00:05:22,767 ‫Let's take a look at our package dot json 119 00:05:25,580 --> 00:05:29,480 ‫and, indeed, here we have all of these packages. 120 00:05:29,480 --> 00:05:30,313 ‫Great. 121 00:05:30,313 --> 00:05:32,480 ‫Now the next step is that we need config 122 00:05:32,480 --> 00:05:36,640 ‫files for both prettier and es lint, right? 123 00:05:36,640 --> 00:05:39,560 ‫And we already created the one for prettier before 124 00:05:39,560 --> 00:05:42,430 ‫and it's already in our project here. 125 00:05:42,430 --> 00:05:44,150 ‫So is this one, and all I did here 126 00:05:44,150 --> 00:05:47,103 ‫was to say that I always want the single quote. 127 00:05:48,200 --> 00:05:49,033 ‫Okay? 128 00:05:49,033 --> 00:05:52,530 ‫And the other one is the config file for es lint, 129 00:05:52,530 --> 00:05:55,560 ‫and again it's already in the startup files 130 00:05:55,560 --> 00:05:58,290 ‫because we don't really need to waste any time 131 00:05:58,290 --> 00:06:00,560 ‫simply just to write this terrible 132 00:06:00,560 --> 00:06:02,970 ‫configuration file, right? 133 00:06:02,970 --> 00:06:04,380 ‫So the file is already written 134 00:06:04,380 --> 00:06:06,900 ‫let's just go very quickly through it. 135 00:06:06,900 --> 00:06:08,270 ‫So here we stated we want to use 136 00:06:08,270 --> 00:06:10,060 ‫the airbnb style guide, 137 00:06:10,060 --> 00:06:11,639 ‫and also prettier, and also 138 00:06:11,639 --> 00:06:15,420 ‫the node plugin, okay? 139 00:06:15,420 --> 00:06:18,580 ‫Now esl int is all about coding rules 140 00:06:18,580 --> 00:06:21,230 ‫and there are many many rules that es lint 141 00:06:21,230 --> 00:06:23,230 ‫tries to enforce on us. 142 00:06:23,230 --> 00:06:24,760 ‫But we can actually change the ones 143 00:06:24,760 --> 00:06:27,060 ‫that we want to use, one by one. 144 00:06:27,060 --> 00:06:29,320 ‫And we can either turn them off completely 145 00:06:29,320 --> 00:06:32,790 ‫or just showing a warning instead of showing an error. 146 00:06:32,790 --> 00:06:35,351 ‫For example, one rule is that eslint 147 00:06:35,351 --> 00:06:38,760 ‫does not want us to use console dot logs 148 00:06:38,760 --> 00:06:41,990 ‫in our code, and so each time by default 149 00:06:41,990 --> 00:06:43,740 ‫it will give us an error when we 150 00:06:43,740 --> 00:06:45,210 ‫use console dot log. 151 00:06:45,210 --> 00:06:46,890 ‫But instead of showing me an error, 152 00:06:46,890 --> 00:06:50,160 ‫I configure it so that it only shows me a warning, 153 00:06:50,160 --> 00:06:52,170 ‫so that's why we have warn. 154 00:06:52,170 --> 00:06:53,900 ‫I could also completely turn it off 155 00:06:53,900 --> 00:06:55,937 ‫by writing off, such as I did with 156 00:06:55,937 --> 00:06:58,380 ‫many of these other rules. 157 00:06:58,380 --> 00:07:01,060 ‫So, for example, here in this next one 158 00:07:01,060 --> 00:07:03,220 ‫which says that each and every function 159 00:07:03,220 --> 00:07:05,750 ‫should always return something, okay? 160 00:07:05,750 --> 00:07:08,530 ‫And sometimes, we simply have a function which doesn't, 161 00:07:08,530 --> 00:07:11,870 ‫and so I needed to turn this rule completely off. 162 00:07:11,870 --> 00:07:14,116 ‫Or finally, we also have, for example, 163 00:07:14,116 --> 00:07:17,160 ‫this rule here, which says that there should 164 00:07:17,160 --> 00:07:21,230 ‫never be a variable that we declare but do not use. 165 00:07:21,230 --> 00:07:23,460 ‫This actually catches a lot of bugs, 166 00:07:23,460 --> 00:07:26,140 ‫and so I leave it as an error here, 167 00:07:26,140 --> 00:07:28,260 ‫but I also created some exceptions. 168 00:07:28,260 --> 00:07:30,950 ‫So, these four exceptions here 169 00:07:30,950 --> 00:07:32,540 ‫which are the typical variables 170 00:07:32,540 --> 00:07:33,980 ‫that we have in express, 171 00:07:33,980 --> 00:07:38,170 ‫so in our handlers in express, but that we don't always use. 172 00:07:38,170 --> 00:07:39,003 ‫Right? 173 00:07:39,003 --> 00:07:41,840 ‫And so I don't want these to be marked as errors 174 00:07:41,840 --> 00:07:43,790 ‫each time that I have, for example, 175 00:07:43,790 --> 00:07:47,150 ‫a req variable in a function, but I don't use it. 176 00:07:47,150 --> 00:07:48,130 ‫Okay? 177 00:07:48,130 --> 00:07:50,850 ‫So you can take a look at these other rules here 178 00:07:50,850 --> 00:07:52,440 ‫and decide which one you like, 179 00:07:52,440 --> 00:07:54,180 ‫and which one you don't. 180 00:07:54,180 --> 00:07:56,910 ‫So these ones are the rules that make sense to me, 181 00:07:56,910 --> 00:07:59,520 ‫but of course it might be different for you. 182 00:07:59,520 --> 00:08:01,950 ‫Let's just quickly go to the eslint website 183 00:08:01,950 --> 00:08:03,630 ‫to take a look at all the stuff 184 00:08:03,630 --> 00:08:05,163 ‫that you can configure. 185 00:08:07,900 --> 00:08:12,900 ‫So es lint, then here you have some documentation 186 00:08:13,230 --> 00:08:16,320 ‫and some instructions on how you can configure it, 187 00:08:16,320 --> 00:08:17,740 ‫but all I really wanna show you 188 00:08:17,740 --> 00:08:19,800 ‫is all these different rules. 189 00:08:19,800 --> 00:08:21,530 ‫So you have all of them in here 190 00:08:21,530 --> 00:08:25,110 ‫and so you see, there's a ton, a ton really, of them 191 00:08:25,110 --> 00:08:28,741 ‫that you can configure, okay? 192 00:08:28,741 --> 00:08:31,010 ‫So take a look at this, but actually 193 00:08:31,010 --> 00:08:35,470 ‫it's easier to simply configure this es lint 194 00:08:35,470 --> 00:08:37,990 ‫whenever you get a new error in your code. 195 00:08:37,990 --> 00:08:38,823 ‫Okay? 196 00:08:38,823 --> 00:08:40,310 ‫So let me show that to you, 197 00:08:40,310 --> 00:08:42,600 ‫so that we can now see it in practice. 198 00:08:42,600 --> 00:08:45,590 ‫So let's go to our server file here, 199 00:08:45,590 --> 00:08:47,400 ‫and simply create some code here 200 00:08:47,400 --> 00:08:49,273 ‫that goes against some es rules. 201 00:08:50,440 --> 00:08:54,930 ‫So for example defining a variable here, like this, 202 00:08:54,930 --> 00:08:56,930 ‫and then assigning something else to it. 203 00:08:58,399 --> 00:09:01,400 ‫All right, and so we know that x is a constant 204 00:09:01,400 --> 00:09:03,430 ‫and so it should not be reassigned. 205 00:09:03,430 --> 00:09:05,070 ‫So if we give this now assigned, 206 00:09:05,070 --> 00:09:07,160 ‫we should actually see an error. 207 00:09:07,160 --> 00:09:10,210 ‫And well we did not, so I'm gonna go ahead 208 00:09:10,210 --> 00:09:12,653 ‫and close the window, and then open it again. 209 00:09:13,640 --> 00:09:15,400 ‫So do that as well 210 00:09:15,400 --> 00:09:18,010 ‫and hopefully it will be working by then. 211 00:09:18,010 --> 00:09:21,240 ‫Okay, and so actually we see our errors here 212 00:09:21,240 --> 00:09:22,968 ‫now marked in red. 213 00:09:22,968 --> 00:09:25,690 ‫So, we now come to this problems tab. 214 00:09:25,690 --> 00:09:28,160 ‫Let me move it up a bit, 215 00:09:28,160 --> 00:09:32,020 ‫and so here we see all the errors that we have. 216 00:09:32,020 --> 00:09:33,830 ‫So, starting with the first one, 217 00:09:33,830 --> 00:09:36,460 ‫expected one empty line after the required 218 00:09:36,460 --> 00:09:39,250 ‫statement not followed by another require. 219 00:09:39,250 --> 00:09:40,840 ‫So basically what it's telling me 220 00:09:40,840 --> 00:09:43,680 ‫is that it wants these requires here at the top 221 00:09:44,750 --> 00:09:48,510 ‫and then, an empty line and then like this. 222 00:09:48,510 --> 00:09:50,710 ‫And so, the error disappears. 223 00:09:50,710 --> 00:09:51,543 ‫Okay? 224 00:09:51,543 --> 00:09:54,353 ‫And so this kind of enforces a nicer coding standard. 225 00:09:55,790 --> 00:10:00,790 ‫Next up we have x is assigned and a value never used. 226 00:10:01,010 --> 00:10:02,867 ‫And so that is that no unused variables 227 00:10:02,867 --> 00:10:05,110 ‫that I mentioned before. 228 00:10:05,110 --> 00:10:06,723 ‫So, this one here. 229 00:10:07,680 --> 00:10:08,513 ‫Okay? 230 00:10:08,513 --> 00:10:12,290 ‫And so this is an error, but I could also turn it off 231 00:10:12,290 --> 00:10:14,643 ‫just to show you how that would then change. 232 00:10:15,830 --> 00:10:19,660 ‫So I've saved it, and so now that error is gone. 233 00:10:19,660 --> 00:10:21,510 ‫So you see it's no longer marked red. 234 00:10:22,930 --> 00:10:25,520 ‫But actually I want this to be an error, 235 00:10:25,520 --> 00:10:29,873 ‫so I write error, give it a save, and our error is back. 236 00:10:31,970 --> 00:10:34,860 ‫You see, it is declared but it's never used. 237 00:10:34,860 --> 00:10:37,660 ‫And then, here x is constant. 238 00:10:37,660 --> 00:10:39,600 ‫So we really did an error here, 239 00:10:39,600 --> 00:10:41,370 ‫which was to reassign a constant, 240 00:10:41,370 --> 00:10:44,480 ‫and that is not allowed, so let's get rid of this 241 00:10:44,480 --> 00:10:47,300 ‫and then the error disappears. 242 00:10:47,300 --> 00:10:49,280 ‫We still have this one because the value 243 00:10:49,280 --> 00:10:50,240 ‫has never been used. 244 00:10:50,240 --> 00:10:55,240 ‫Let's quickly write x plus two and now it's gone. 245 00:10:56,520 --> 00:10:59,180 ‫But we have the next error, basically simply 246 00:10:59,180 --> 00:11:01,220 ‫because we just have this code sitting 247 00:11:01,220 --> 00:11:04,220 ‫around here not assigned to anything. 248 00:11:04,220 --> 00:11:07,277 ‫So, let's just say const y equals this one 249 00:11:07,277 --> 00:11:10,930 ‫but then of course y is assigned but never used, 250 00:11:10,930 --> 00:11:12,931 ‫and so we're entering this loop here. 251 00:11:12,931 --> 00:11:16,453 ‫But, anyway, this was just to demonstrate it to you. 252 00:11:17,706 --> 00:11:20,580 ‫And so let's see now the final warning. 253 00:11:20,580 --> 00:11:23,620 ‫And so that is the no console, right? 254 00:11:23,620 --> 00:11:26,450 ‫So remember I actually talked about this one before 255 00:11:26,450 --> 00:11:28,490 ‫and it is green because it's a warning. 256 00:11:28,490 --> 00:11:31,790 ‫So again, I could turn it off, and then 257 00:11:31,790 --> 00:11:34,950 ‫my problem would disappear, so the code 258 00:11:34,950 --> 00:11:36,270 ‫would look normal now. 259 00:11:36,270 --> 00:11:39,030 ‫But actually I want eslint to warn me about that, 260 00:11:39,030 --> 00:11:40,990 ‫because it's not a good practice to have 261 00:11:40,990 --> 00:11:43,703 ‫all too many console logs later in production. 262 00:11:45,650 --> 00:11:48,440 ‫All right, so it's back now. 263 00:11:48,440 --> 00:11:51,660 ‫And actually vs code also warns me 264 00:11:51,660 --> 00:11:53,790 ‫that there is a green warning 265 00:11:53,790 --> 00:11:54,743 ‫here in this file. 266 00:11:55,810 --> 00:11:57,560 ‫So maybe you noticed that before, 267 00:11:57,560 --> 00:11:59,163 ‫but if we put an error here, 268 00:12:02,043 --> 00:12:04,160 ‫then actually it will turn red. 269 00:12:04,160 --> 00:12:04,993 ‫Okay? 270 00:12:04,993 --> 00:12:08,150 ‫So now it's red, and we have two problems in there. 271 00:12:08,150 --> 00:12:10,320 ‫And that's actually really helpful to identify 272 00:12:10,320 --> 00:12:12,323 ‫problems in all these files. 273 00:12:13,830 --> 00:12:16,770 ‫All right, let's get rid of it. 274 00:12:16,770 --> 00:12:19,175 ‫And so actually, that's it. 275 00:12:19,175 --> 00:12:22,010 ‫So I hope that it worked for you as well 276 00:12:22,010 --> 00:12:25,027 ‫if you got some error then please try to simply 277 00:12:25,027 --> 00:12:27,890 ‫install the same packages that I did. 278 00:12:27,890 --> 00:12:30,452 ‫So all of these here, and remember that 279 00:12:30,452 --> 00:12:31,930 ‫this is how you do it. 280 00:12:31,930 --> 00:12:34,710 ‫So for example, if you want eslint five 281 00:12:34,710 --> 00:12:39,710 ‫just say npm I eslint at five. 282 00:12:40,060 --> 00:12:43,640 ‫For example you can even go five dot 16 dot 0 283 00:12:43,640 --> 00:12:46,370 ‫just to make really sure that everything is the same. 284 00:12:46,370 --> 00:12:48,960 ‫And in that case, everything should work 285 00:12:48,960 --> 00:12:51,050 ‫just as it did here for me. 286 00:12:51,050 --> 00:12:53,757 ‫Great, so this was yet another important step 287 00:12:53,757 --> 00:12:56,690 ‫in your journey of becoming a developer. 288 00:12:56,690 --> 00:12:58,940 ‫Because, believe me, it's really important 289 00:12:58,940 --> 00:13:02,430 ‫to have code linting in place like you have now. 290 00:13:02,430 --> 00:13:04,300 ‫So again, for your next project 291 00:13:04,300 --> 00:13:07,030 ‫just go ahead, copy these dependencies into 292 00:13:07,030 --> 00:13:09,410 ‫your packet dot json file and then install 293 00:13:09,410 --> 00:13:10,750 ‫them all at the same time. 294 00:13:10,750 --> 00:13:13,330 ‫And that will then make your life a lot easier. 295 00:13:13,330 --> 00:13:15,070 ‫So that's how I always do it, 296 00:13:15,070 --> 00:13:17,820 ‫and the same of course, with the prettier rc 297 00:13:17,820 --> 00:13:20,170 ‫and this eslint config file. 298 00:13:20,170 --> 00:13:23,130 ‫Anyway, enough talking for this video. 299 00:13:23,130 --> 00:13:25,690 ‫We're now finally ready to move on to the 300 00:13:25,690 --> 00:13:28,163 ‫very important mongodb section.