00:01Now that we know really everything there is to know about
00:04how to install, uninstall,
00:05and update packages, it's time for us
00:08to take a deeper look into packages.
00:11'cause really when you're working in no js,
00:13what you're really doing is, is you're creating a package.
00:16You might share it with the world or not.
00:19By building it with a package, you're making it easier
00:22for you to move it around and share it with other people.
00:25If internally in your organization
00:28or globally to other people,
00:29you're basically declaring what's inside of your application
00:32and on what does it depend.
00:34So in this lecture, we're gonna learn how
00:36to configure a package
00:38and with it we're also gonna learn on how
00:40to define production dependencies, which is code
00:43that you're using from the external world
00:46that you depend on for your production.
00:49And also how do you define development dependencies
00:52that are dependencies that are only relevant when it's
00:54not in production.
00:56So let's jump right into it and let's see it in action.
01:00So far we've installed locally, globally,
01:03but one of the problems with our local installations is
01:07that we don't really have version management within it.
01:10Beyond that oso, if we wanna send our file onwards,
01:13we would have to send all of our modules with it,
01:16making the files bigger
01:18and making it harder for us to create some sort
01:21of management where we could define what are the modules
01:25that are used and into what version could we use them with.
01:28So to be able to solve that,
01:29and really one of the greatest additions into um,
01:33no JS in general
01:35and NPM is the capability to create a descriptor file,
01:39which is called package js o.
01:42And in it we'll describe our project
01:44and also de describe the dependencies
01:47of the different packages that we're going to use.
01:49So I'm gonna go ahead and just delete our nodes, example,
01:53our nodes modules to create an empty folder again.
01:57And I'm gonna go into my terminal
01:59and what I'm gonna do is I'm gonna type in the folder NPM in
02:03it for initializing.
02:05When I do this, what's gonna happen, it's gonna take me
02:07through an interview where I'm gonna go
02:10through step-by-step naming the name of my project.
02:13Um, I could only contain URL friendly character.
02:16So I'm gonna have to go ahead here.
02:17NPM sample
02:20and I'm gonna version, I'm fine with version one
02:23and I could describe it.
02:24This is a sample of working with NPM,
02:30um, our index, we're fine with that.
02:32We don't have a test command, we don't have a GI repository,
02:36uh, n pm maybe.
02:37And what else would we have here installing in it, how about
02:42that would be our keywords.
02:43Our author is me.
02:44So I'm gonna just type your Ben Fala, uh, license.
02:47I'm not gonna get into that at all at this stage.
02:49Everything here seems okay.
02:50So I'm gonna click on yes once I've done that.
02:54And as soon as I've done that,
02:56I've created a descriptor file,
02:58which you could open up in any editor.
03:00And once you do that, you're gonna see I'm gonna open up
03:03inside of my, um, sublime text
03:06and you can see that we have your a basic construct
03:08to the way packages, the package JS looks like.
03:12Don't worry about this error, this will only come we'll
03:14happen because if we're trying to run a test,
03:17it's gonna say, Hey, we don't have any tests.
03:19We didn't really create any. So this is the basic structure.
03:23Now that we have a basic structure that defines
03:26what our package is,
03:27I wanna just show you it's a few more steps involved here.
03:29How could you create this package quicker?
03:32So I'm just gonna go ahead here and I'm gonna go into
03:35and delete my package here.
03:38And instead of that I'm gonna go into terminal.
03:40And this time around I'm gonna run the same command,
03:43setting it with a marker of yes, by doing this,
03:47it's gonna run automatically
03:48and create the names that it needs to.
03:51Only problem is, is that we set our folder name
03:54to be a folder structure
03:55that is not valid in HTML is not a valid path name.
04:00So I could go ahead there into my finder.
04:02And how about I'm gonna just delete this again
04:05and I'll just go into the folder itself
04:08and rename this folder to be, let me go one more step back
04:16And let me just find it.
04:18And I'm just gonna go ahead here and rename this folder.
04:22So I'm gonna go ahead, rename that folder
04:25and I'm gonna open up in a new tab
04:26so we have your nice clean, fresh start.
04:29Okay, so now that I've opened this up,
04:32we have your a better folder structure.
04:34Let's give it ahead a shot again.
04:35Now that we have a legal HT a legal name,
04:38it's gonna go ahead and automatically create the
04:41folder structure for us.
04:42That Jason folder structure for us.
04:45All that's left for us to do is if we wanted to,
04:48we could improve the structure slightly.
04:51What we could do is to improve the structure,
04:53is we could set default values, for example,
04:56for our name of our author.
04:58So if I go ahead here
04:59and just load in the new package that was loaded,
05:02it's gonna put your no author name
05:03and we really want to have maybe some sort of a default.
05:06So anything that you know is not going to change
05:10or is not going to change often what you could do,
05:13and I'm just gonna go ahead here
05:14and clear here, I could go to my NPM
05:16and I could set default values.
05:19For example, for our in it, I'm gonna set an author name
05:22to be Ben Val.
05:25Now all the different properties that you'll find inside
05:27of your descriptor, you could set here.
05:29So for example, if you look at here, I could, there,
05:31you could look in the documentation,
05:33but for for author, I'm setting my author name
05:35because I have your to a secondary command, which is email.
05:39And I'm gonna set that author email as well.
05:41So every single package that I create will have access
05:43to my email as well.
05:46Um, I'm not gonna go much further into these global
05:49parameters, but if you are creating a lot of projects often
05:52and you don't wanna worry about creating these default
05:55values over and over, you could literally,
05:58by setting those defaults, you could then go
06:00and run in it again without the interview
06:04and have it automatically assign the value.
06:06Ben fallow with that email and the author.
06:08You could change the license description version and so on
06:12and so forth and di differentiate
06:14and change it the way the names are created.
06:17So that's it about the setup, the core setup of your, um,
06:21package, json file.
06:23But really the reason why we created that was to be able
06:26to list out the dependencies.
06:28So let's go ahead and install, again, that is array module,
06:32but this time around I'm gonna set it
06:34and say save it by setting it to save it.
06:37And you really want to do it in any package
06:39that you install locally
06:41because what's gonna happen, it's gonna, oh, I forgot
06:44to start it with NPM silly me NPM.
06:49And once I do that, it's gonna go ahead
06:51and download that package
06:53and it's gonna add it into our dependency.
06:56So if I go ahead into that file in our JSON
06:58and refresh it, we'll see that we, now we have a dependency
07:01and we have your aversion 1.00.
07:04Beautiful. Now I wanna show you just one more thing is,
07:08in general, not only when you're creating
07:11and installing elements, so I'm gonna go ahead here
07:14and, uh, what I want to do is I'm gonna just go ahead here
07:16and I'm just going to get rid of everything here
07:19and I'm gonna go ahead and redo it.
07:21'cause what I wanna do is I wanna show you also the process
07:24of not only installing it for, for example,
07:26when you might have scenarios
07:28where you're only working on development.
07:30You know, I'm not gonna delete, I'm just gonna show you
07:31that you could also save for dev.
07:34And if I set it to save for Dev,
07:35what's gonna happen is it's gonna install the package
07:38and it's gonna set it up in a dev dependencies.
07:41Now, dev dependencies could be different debugger
07:43operations, different things that you don't want production
07:46to have, but you want the dependency
07:48to exist in your dev environment itself,
07:51but not in the live environment.
07:53So you see you have two different ways
07:55of installing elements
07:57and you could go back into any point in a package,
07:59you could remove it.
08:01So if I go into back and I want to say I want to remove,
08:03not install, I wanna remove it, I'm going to remove,
08:08and I'm gonna keep that minus, minus save dash dev.
08:11And once I do that, it's gonna make sure
08:13that it's gonna be removed
08:14and it will also go into our dependencies
08:17and remove it from our dependencies.
08:19Now, we could manually have done it, but it's so much easier
08:22and so much nicer working with our terminal.
08:24So get used to working with it
08:26because it's gonna really streamline your work when we get
08:29into the following chapters as we go into know JS
08:32and other elements
08:34and other things that we're gonna work within
08:36our application.
08:37So that's it. Now you know how to create a JSO uh, package.
08:40Do JSO and describe it
08:42and set up its packages, its dependencies
08:45and its dev dependencies.
08:48In this lecture we learned how to create a package js o file
08:52and that brings us very close to the end of the, the topics
08:55that relate to NPM, leaving us with one more topic
08:59and that is understanding really well version controlling
09:02and that is both for you, the packages you will create,
09:05but also for knowing how to ask for the right packages.
09:10I.