1
00:00:00,210 --> 00:00:06,360
You now know how to use the node module system to load in core node modules like the file system module

2
00:00:06,570 --> 00:00:11,520
and other files you've created like notes Doc J s in this video.

3
00:00:11,520 --> 00:00:16,410
You're gonna learn how to use the module system to load in NPM packages.

4
00:00:16,410 --> 00:00:22,980
This is going to allow us to take advantage of all of those awesome NPM modules from right inside of

5
00:00:22,980 --> 00:00:24,840
our node applications.

6
00:00:24,840 --> 00:00:31,230
There are an endless amount of awesome useful NPM packages that we can install so we don't have to recreate

7
00:00:31,230 --> 00:00:32,940
the wheel from scratch.

8
00:00:32,940 --> 00:00:36,750
There are things that pretty much every application out there needs to do.

9
00:00:36,750 --> 00:00:42,090
Examples would be validating data like emails and maybe even sending an email.

10
00:00:42,090 --> 00:00:47,530
These are core functionality not specific to what your application does for your users.

11
00:00:47,550 --> 00:00:53,850
So if we use NPM modules to solve common problems which is indeed the standard in the node community

12
00:00:54,090 --> 00:00:59,660
then we can spend our developer time focusing on the awesome features that make our app unique.

13
00:00:59,670 --> 00:01:06,540
So as I mentioned a bit earlier in the class when we installed node we also got the NPM program installed

14
00:01:06,540 --> 00:01:07,590
on our machine.

15
00:01:07,590 --> 00:01:15,030
This gives us access to everything over at NPM J S dot com which we'll head back over to in just a few

16
00:01:15,090 --> 00:01:16,060
moments.

17
00:01:16,110 --> 00:01:22,440
Now before we can actually use any of these modules in our script we have to take two very important

18
00:01:22,500 --> 00:01:23,010
steps.

19
00:01:23,010 --> 00:01:30,960
One we have to initialize NPM in our project then two we have to install all of the modules we actually

20
00:01:30,990 --> 00:01:32,280
want to use.

21
00:01:32,280 --> 00:01:34,740
So let's go ahead and see how that happens.

22
00:01:34,740 --> 00:01:41,520
First up let's initialize NPM in our project which means we have to run a single command from the project

23
00:01:41,580 --> 00:01:44,860
root that root directory is the notes app folder.

24
00:01:44,910 --> 00:01:48,380
So make sure you're running commands from there in the terminal down below.

25
00:01:48,390 --> 00:01:51,150
I am indeed accessing that directory.

26
00:01:51,330 --> 00:01:57,330
Now when we first installed node we got the version of node we were using by using the node command

27
00:01:57,360 --> 00:02:00,270
with the V flag when we installed node.

28
00:02:00,270 --> 00:02:03,960
We also got access to the NPM command line tools.

29
00:02:03,960 --> 00:02:08,000
We can run that with the V flag to get the version of NPM we're running.

30
00:02:08,100 --> 00:02:12,700
And right here you can see I'm running version six point four point one.

31
00:02:12,720 --> 00:02:20,890
Now the specific version of NPM you're using does not matter as long as you're using version 5 or greater.

32
00:02:20,910 --> 00:02:27,750
So as long as that first number is either 5 or higher which it should be you're good to go now from

33
00:02:27,750 --> 00:02:28,320
here.

34
00:02:28,380 --> 00:02:34,110
We have to initialize NPM in our project and we do that by running a single command from the root of

35
00:02:34,110 --> 00:02:36,810
the project NPM in it.

36
00:02:36,810 --> 00:02:42,900
This command is going to initialize NPM in our project and in the end of the day it's not going to do

37
00:02:42,960 --> 00:02:44,270
anything fancy.

38
00:02:44,340 --> 00:02:51,390
It is simply going to create a single configuration file that we can use to manage all of the dependencies

39
00:02:51,600 --> 00:02:54,350
from the NPM Web site that we want to install.

40
00:02:54,360 --> 00:02:57,990
So right here we're gonna go ahead and run NPM in it.

41
00:02:57,990 --> 00:03:02,850
Now it has a lot of information telling us exactly what's happening in the end of the day what's really

42
00:03:02,850 --> 00:03:10,290
going on is that NPM is asking us for some information to populate various fields in this configuration

43
00:03:10,290 --> 00:03:11,270
file.

44
00:03:11,280 --> 00:03:13,290
Now we can type out custom answers.

45
00:03:13,320 --> 00:03:18,390
So for example the first piece of information it wants is just a name for our package.

46
00:03:18,420 --> 00:03:20,670
So some sort of name for this project.

47
00:03:20,670 --> 00:03:24,240
Now by default it uses the folder name notes app.

48
00:03:24,390 --> 00:03:30,150
We can choose to use that by just hitting enter or we could type something custom to override that value

49
00:03:30,480 --> 00:03:33,120
for every single question it asks.

50
00:03:33,120 --> 00:03:36,750
We're going to stick with the default value so we have package name.

51
00:03:36,750 --> 00:03:38,130
I'm just gonna hit enter.

52
00:03:38,130 --> 00:03:46,380
We have a version we have description entry point test command get repository keywords author and license.

53
00:03:46,380 --> 00:03:51,420
Now there are a few of these fields we'll be exploring in detail later we'll talk about testing when

54
00:03:51,420 --> 00:03:55,050
we explore testing and we'll talk about the get repository.

55
00:03:55,050 --> 00:04:01,410
When we set up deployment many of these fields however are for folks who are creating NPM packages which

56
00:04:01,410 --> 00:04:02,580
is not what we're doing.

57
00:04:02,640 --> 00:04:09,480
We're creating a application on our own and we're trying to consume NPM packages so the values for many

58
00:04:09,480 --> 00:04:13,080
of these are not important for our purposes right here.

59
00:04:13,140 --> 00:04:19,050
We can hit enter on that last one and it's asking us if things are OK now what exactly is it doing well

60
00:04:19,060 --> 00:04:26,910
it tells us it's about to write a package dot Jason File to the notes app directory down below.

61
00:04:26,980 --> 00:04:31,170
If this is the exact contents it's about to write to that file.

62
00:04:31,260 --> 00:04:32,650
Everything looks good.

63
00:04:32,670 --> 00:04:39,360
We can type yes to confirm that we want NPM in it to actually create that file and now we have a brand

64
00:04:39,360 --> 00:04:42,270
new file in our project route.

65
00:04:42,270 --> 00:04:45,880
If I crack it open we can see that has NPM promised.

66
00:04:45,930 --> 00:04:50,180
It looks exactly like what we had output it in the terminal down below.

67
00:04:50,250 --> 00:04:56,820
The extension for this file is Jason which stands for a javascript object notation and as you can see

68
00:04:56,820 --> 00:04:59,400
it looks a bit like a javascript object.

69
00:04:59,400 --> 00:05:04,500
There are a couple subtle differences we'll explore as we use Jason throughout the class.

70
00:05:04,500 --> 00:05:09,720
It's something we're gonna be covering in great detail for now all you really need to know is that you

71
00:05:09,720 --> 00:05:16,290
have to use double quotes instead of single quotes and all of your property names like name or author.

72
00:05:16,290 --> 00:05:19,850
They also need to be wrapped in quotes like we're seeing here.

73
00:05:19,860 --> 00:05:26,400
If I were to remove the quotes from one of our property names like license this would be valid in javascript

74
00:05:26,550 --> 00:05:29,060
but we can see it's invalid in Jason.

75
00:05:29,100 --> 00:05:31,710
So let's go ahead and bring those back.

76
00:05:31,950 --> 00:05:37,920
Now this file is gonna be used to manage all of the dependencies that our application needs to run.

77
00:05:38,160 --> 00:05:44,100
So in here we're going to list out all of the NPM packages we want to use to start let's go ahead and

78
00:05:44,100 --> 00:05:49,360
move to NPM J ask.com and find a package we actually want to work with.

79
00:05:49,440 --> 00:05:55,320
Now for this example we're going to install the very popular validator package which gives us all sorts

80
00:05:55,320 --> 00:05:58,260
of awesome tools to perform data validation.

81
00:05:58,260 --> 00:06:05,020
So right here in the NPM search bar I'm going to search for validator and we're looking for that first

82
00:06:05,020 --> 00:06:05,440
result.

83
00:06:05,440 --> 00:06:07,220
The validator package.

84
00:06:07,240 --> 00:06:09,930
Now there are other validation packages out there.

85
00:06:09,940 --> 00:06:11,890
There's even one with a capital V.

86
00:06:11,920 --> 00:06:15,300
We want this first result lower case validator.

87
00:06:15,310 --> 00:06:19,600
Now when we click that it's going to bring us over to the NPM package page.

88
00:06:19,600 --> 00:06:26,210
This is a great page every NPM package has one and it gives us a ton of information about the package.

89
00:06:26,260 --> 00:06:29,280
We have the documentation for how to actually use it.

90
00:06:29,380 --> 00:06:33,370
And on the right hand side we have a bunch of great stats about the package.

91
00:06:33,370 --> 00:06:38,310
Things like the version number they get hub home page and the weekly downloads.

92
00:06:38,320 --> 00:06:43,950
This is a very popular package with over one million weekly downloads.

93
00:06:43,990 --> 00:06:48,670
So if you wanted to perform a little validation in your note app there are two ways you could go about

94
00:06:48,670 --> 00:06:49,060
that.

95
00:06:49,060 --> 00:06:52,680
The first approach would be to write all of the validation code yourself.

96
00:06:52,690 --> 00:06:54,860
You have to write the code you have to maintain it.

97
00:06:54,880 --> 00:06:59,220
You're going to want to write test cases for it to make sure there are no edge cases.

98
00:06:59,260 --> 00:07:05,320
And in general you're going to have to keep up with that code as node progresses over time.

99
00:07:05,320 --> 00:07:06,850
Now that's option 1.

100
00:07:06,860 --> 00:07:11,800
Now when you're creating an application I doubt that validation is what makes it unique.

101
00:07:11,800 --> 00:07:17,350
So if I'm creating a weight loss application as an example I likely have some sort of reason why I'm

102
00:07:17,350 --> 00:07:18,020
doing it.

103
00:07:18,040 --> 00:07:23,770
I have a model about either diet or exercise or habits that's going to help people lose weight in a

104
00:07:23,770 --> 00:07:25,680
way they weren't able to before.

105
00:07:25,720 --> 00:07:29,980
What makes my app unique is likely not how it validates emails.

106
00:07:30,010 --> 00:07:35,740
So sure you could write that code but it's a much better practice for a lot of these basic features

107
00:07:35,740 --> 00:07:41,980
to take advantage of a well tested NPM package like this one where millions of different applications

108
00:07:41,980 --> 00:07:45,340
and utilities are taking advantage of it all the time.

109
00:07:45,340 --> 00:07:48,030
Now that's not to say we're not going to write code.

110
00:07:48,070 --> 00:07:54,010
We are but for some things we're going to take advantage of other packages that allow us to get it done

111
00:07:54,010 --> 00:07:56,160
in a much more secure way.

112
00:07:56,170 --> 00:08:00,840
So in this case the validator package has all sorts of tools for validating emails.

113
00:08:00,850 --> 00:08:06,610
You are L's phone numbers social security numbers credit cards and other types of string information

114
00:08:06,880 --> 00:08:07,740
like that.

115
00:08:07,750 --> 00:08:10,970
Let's go ahead and install it and see how it works.

116
00:08:10,990 --> 00:08:15,520
Now what we're gonna do is note the package name because that is essential.

117
00:08:15,610 --> 00:08:21,910
You can actually see a command over here that we can run it to install it right here lowercase the validator

118
00:08:22,120 --> 00:08:27,150
is the package name that we need and we're going to head over to the terminal and install this.

119
00:08:27,160 --> 00:08:33,190
Now we want to run the command we're about to run once again from the notes app directory right here.

120
00:08:33,250 --> 00:08:36,370
That's npm install validator.

121
00:08:36,370 --> 00:08:40,540
Now you'll notice on the Web site they used NPM I validator.

122
00:08:40,540 --> 00:08:41,860
Those are identical.

123
00:08:41,860 --> 00:08:47,730
I is just a shorthand for install you're more than welcome to use either approach.

124
00:08:47,800 --> 00:08:51,960
Now from here we're going to specify the specific version we want to install.

125
00:08:51,970 --> 00:08:57,850
So at then the version number I'm going to be using the latest version currently available which is

126
00:08:57,850 --> 00:09:04,900
ten point eight point zero in this course I'm always going to specify package versions to make sure

127
00:09:04,900 --> 00:09:11,680
that we're always on the same page NPM modules do change their API over time so to ensure the video's

128
00:09:11,710 --> 00:09:17,710
always work I'll be lacking us into specific packages including updates when API is change.

129
00:09:17,710 --> 00:09:20,200
So right here this is the command we want to run.

130
00:09:20,650 --> 00:09:22,500
Now when we run this what's it going to do.

131
00:09:22,630 --> 00:09:25,690
Well it's going to go off to the NPM servers.

132
00:09:25,690 --> 00:09:29,220
It's going to grab all of the code for that package.

133
00:09:29,230 --> 00:09:34,690
And it's actually going to add it into our application and we'll notice that when we ran that command

134
00:09:34,930 --> 00:09:42,780
two things happened one we got a package hyphen LOC dot Jason File and two we got a new directorate

135
00:09:43,060 --> 00:09:45,600
a node modules directory.

136
00:09:45,610 --> 00:09:47,230
Let's take a quick look at both.

137
00:09:47,230 --> 00:09:48,970
First up node modules.

138
00:09:48,970 --> 00:09:53,900
This is a folder which contains all of the code for the dependencies we installed.

139
00:09:53,920 --> 00:09:55,990
So if I crack this open what do we have.

140
00:09:56,080 --> 00:09:58,210
We have a single directory validator.

141
00:09:58,210 --> 00:10:00,070
That's the package we installed.

142
00:10:00,070 --> 00:10:04,180
And if we open that up it's all of the code for the validator package.

143
00:10:04,180 --> 00:10:09,970
Now the node modules directory is something we should not be manually editing we should not go inside

144
00:10:09,970 --> 00:10:15,370
of validator and actually change these files and we'll talk more about that as we progressed through

145
00:10:15,370 --> 00:10:20,980
the course and learn more about package management when it comes to working with node modules.

146
00:10:20,980 --> 00:10:25,510
It's just going to get generated and edited when we run npm install commands.

147
00:10:25,540 --> 00:10:32,650
So we use npm install and NPM maintains this directory the same thing is true with package hyphen locked.

148
00:10:32,650 --> 00:10:39,490
Jason this is a file which contains extra information making NPM a bit faster and a bit more secure.

149
00:10:39,550 --> 00:10:45,220
It lists out exact versions of all of our dependencies as well as where they were fetched from.

150
00:10:45,250 --> 00:10:51,430
And we also have a char hash making sure that we're getting the exact code that we got previously if

151
00:10:51,430 --> 00:10:53,870
we were to install a dependency again.

152
00:10:53,980 --> 00:10:57,310
Once again this is not a file we should ever be editing.

153
00:10:57,340 --> 00:11:00,400
Once again this will be maintained by NPM.

154
00:11:00,400 --> 00:11:05,720
So we have our package installed and when we ran that command it was even added to package.

155
00:11:05,740 --> 00:11:08,020
Jason we have a dependencies property.

156
00:11:08,080 --> 00:11:12,220
We have our dependency name along with the version we installed.

157
00:11:12,400 --> 00:11:17,810
Now that we have it installed we can move into our node app a file such as app dot J.

158
00:11:17,830 --> 00:11:24,280
S and actually load it in with require and take advantage of some of the functionality it provides to

159
00:11:24,280 --> 00:11:25,990
load in an NPM package.

160
00:11:25,990 --> 00:11:32,590
We once again use require I'm going to add a second requires statement to this file right here.

161
00:11:32,590 --> 00:11:39,550
We're gonna go ahead and use require like we did previously and we are indeed going to pass in a string.

162
00:11:39,550 --> 00:11:45,730
Now for those core node modules we typed out the module name for our files we would start with DOT forward

163
00:11:45,730 --> 00:11:50,380
slash to provide the relative path to the file for NPM modules.

164
00:11:50,380 --> 00:11:52,870
We list out the NPM package name.

165
00:11:52,900 --> 00:11:55,210
So in this case that would be validator.

166
00:11:55,300 --> 00:12:01,090
And this is similar to what we do with those core node modules now require is going to return all of

167
00:12:01,090 --> 00:12:04,150
the stuff that the validator package provides us.

168
00:12:04,180 --> 00:12:10,990
So right here I can create a variable like validator that's going to store the contents that comes back

169
00:12:11,080 --> 00:12:12,250
from require.

170
00:12:12,310 --> 00:12:17,470
Now when it comes to figuring out how to use a given package this is when you just have to turn to the

171
00:12:17,470 --> 00:12:21,120
documentation to figure out how it was intended to be used.

172
00:12:21,160 --> 00:12:25,640
We're going to end up looking at the documentation for every tool we install.

173
00:12:25,690 --> 00:12:30,640
I'd like to point you towards the documentation since that's gonna give you all of the information you

174
00:12:30,640 --> 00:12:37,180
would need to learn more about how something works or to explore other ways a given tool can be used.

175
00:12:37,180 --> 00:12:43,000
Now for our purposes on the NPM package page we have all of the different ways that this tool can be

176
00:12:43,000 --> 00:12:43,870
used.

177
00:12:43,870 --> 00:12:49,710
If we scroll down to the validators section we have a method and we have a description of how it works.

178
00:12:49,720 --> 00:12:54,820
There are maybe a hundred different methods for all sorts of different things we can do.

179
00:12:54,850 --> 00:13:01,810
One of the methods is is email this allows us to determine if a given email is valid and that's something

180
00:13:01,810 --> 00:13:04,010
we are indeed going to take advantage of.

181
00:13:04,030 --> 00:13:09,370
This method can be accessed directly on validator which is an object.

182
00:13:09,400 --> 00:13:11,560
So let's go ahead and test this out.

183
00:13:11,620 --> 00:13:17,470
I'm going to add a console dot log called down below so we can print some output to the terminal and

184
00:13:17,470 --> 00:13:23,020
instead of creating a variable and then passing that into council dot log I'm just gonna call the function

185
00:13:23,080 --> 00:13:25,350
right inside of console dot luck.

186
00:13:25,360 --> 00:13:33,850
So right here validator dot the method name that's is email and we're going to pass in to that method

187
00:13:33,850 --> 00:13:36,910
call a single string argument.

188
00:13:36,910 --> 00:13:42,940
So right here let's go ahead and try something like Andrew at example dot com which it should indeed

189
00:13:42,940 --> 00:13:47,290
be a valid email as it contains all of the component pieces.

190
00:13:47,290 --> 00:13:50,530
Now let's run our application from the terminal down below.

191
00:13:50,530 --> 00:13:55,200
I'm going to clear the output using the clear command or CLSA on Windows.

192
00:13:55,300 --> 00:13:59,300
Then I'm going to run node with app dot J s when I do that.

193
00:13:59,320 --> 00:14:00,160
What do I get.

194
00:14:00,340 --> 00:14:06,490
I get my first piece of information from line 5 then I get true which is coming from line 7.

195
00:14:06,520 --> 00:14:09,080
So here we have a valid email.

196
00:14:09,100 --> 00:14:10,570
Now let's switch that up.

197
00:14:10,660 --> 00:14:18,130
I'm gonna remove Andrew and the at sign leaving just example dot com I'll save app dot J.S. again I'll

198
00:14:18,130 --> 00:14:24,910
rerun our script and this time we correctly get false the information passed in is no longer a valid

199
00:14:24,980 --> 00:14:32,290
email so is email returns true if the string is an email it returns false if the string is not and there

200
00:14:32,290 --> 00:14:38,980
we go we were able to install an NPM package load it into our node application and take advantage of

201
00:14:38,980 --> 00:14:40,920
it to do something meaningful.

202
00:14:40,990 --> 00:14:45,100
Before we wrap this one up let's go ahead and explore one more method.

203
00:14:45,100 --> 00:14:47,600
Right here we have an alphabetical list of methods.

204
00:14:47,620 --> 00:14:51,160
I'm gonna scroll down to is and we're looking for you.

205
00:14:51,160 --> 00:14:58,280
4 is you are all right here we have another method allowing us to determine if a given string is U.R.L..

206
00:14:58,660 --> 00:15:00,700
So let's go ahead and test that out.

207
00:15:00,700 --> 00:15:04,570
I'm going to remove is email something we'll be using later in the class.

208
00:15:04,900 --> 00:15:07,430
I'm gonna swap it out with is you are L..

209
00:15:07,480 --> 00:15:10,290
Then I'm gonna change the string value I provide.

210
00:15:10,480 --> 00:15:12,190
Let's go ahead and try my own site.

211
00:15:12,190 --> 00:15:20,010
You are l h t t P.S. colon forward slash forward slash meat dot I oh I'm gonna save the file I'm gonna

212
00:15:20,020 --> 00:15:22,790
rerun the program and this time we get true.

213
00:15:22,900 --> 00:15:29,200
Now I'm gonna mess that up maybe I'll do something like remove one of the colons and the forward slash

214
00:15:29,980 --> 00:15:36,310
I'll run the script again and what do I get I get false this is indeed an invalid you are out now when

215
00:15:36,310 --> 00:15:43,390
it comes to taking advantage of the documentation for a given package it's usually best to find an example

216
00:15:43,570 --> 00:15:49,330
sometimes the documentation itself doesn't really make it clear how something is to be used up at the

217
00:15:49,330 --> 00:15:56,210
top though we can see there are real examples similar to what we just did inside of our own project.

218
00:15:56,380 --> 00:16:00,760
Now you'll notice there are two versions here no iOS 6 and iOS 6.

219
00:16:00,820 --> 00:16:07,130
This is a note of course uses iOS 6 iOS 7 and more modern features throughout.

220
00:16:07,320 --> 00:16:12,960
The only big difference here is that up above we're using require which is what we're using in node

221
00:16:13,170 --> 00:16:13,800
and down below.

222
00:16:13,800 --> 00:16:20,310
They're using a slightly different syntax using the import keyword node currently does not support the

223
00:16:20,310 --> 00:16:26,990
import keyword support is coming for it later down the line and when it is supported I'll add a section

224
00:16:27,000 --> 00:16:27,810
covering it.

225
00:16:27,810 --> 00:16:32,090
But for now in node j us when we want to load something in reuse require.

226
00:16:32,100 --> 00:16:37,500
So right here this would be a great example to kind of help us figure out exactly how the package is

227
00:16:37,500 --> 00:16:38,850
intended to be used.

228
00:16:39,300 --> 00:16:41,410
That's where we're going to stop for this one.

229
00:16:41,460 --> 00:16:47,490
We have installed the package we've required it into our file and we've used it in the next video as

230
00:16:47,490 --> 00:16:48,450
a challenge.

231
00:16:48,480 --> 00:16:52,360
You're going to end up doing the same thing for a different library.

232
00:16:52,560 --> 00:16:53,930
I'm excited to get to that.

233
00:16:53,970 --> 00:16:57,220
So let's go ahead and jump right in to the next one.