Node.js Crash Course Tutorial #5 - NPM

Video Statistics and Information

Video
Captions Word Cloud
Reddit Comments
Captions
I rather than gank so far we've seen how to use core modules and packages that are built into the node core for example the FS module to work with the file system but what if we want to use some additional packages for extra features in node that are not available in the node core now this could be for something like a JavaScript utility library like lodash or maybe a package to help with validation logic or it could even be some kind of framework for building node websites like Express there are literally thousands of user made packages that we can use with node and we can install them using NPM the node package manager now NPM is automatically installed onto your computer when you install node and it's a tool that we can use to install update or remove node packages onto our computer directly and also into our individual projects to use now you might have even used NPM in the past for installing front and frameworks or libraries like view and react or something else but we're going to be using it to install packages that are going to help us with our node websites so you can reach the NPM site by going to NPM j us com that link will be down below and on this website we can search for different packages we might want to use in our project so for example I could search for low - and if we click on that result we can see how to install low - and how to use it in node and also hopefully a home page and a repository to check out the docs and how to use this package another package is no daman and this is the one we're going to be installing first of all onto our computer and this helps us with a development workflow so we don't have to keep restarting the server manually so I'm going to use NPM first of all to show you how to install this globally onto your computer okay then so no daman is a package which helps us to create a live reload server and that's really gonna speed up the development process because currently every time we make any kind of change to our server code we have to cancel out of the current process in the terminal and then rerun the file again and this restarts the server to reflect those changes in the browser so let me just demo this if I change this redirect here from about me to about us now I've changed the code I would have to first set the file then cancel out of this current process by clicking ctrl C then run the file again by saying node server and then pressing enter then I could see those changes in the browser when I make a request so I could go to about us now and it would work it would redirect form it but this would get tiresome after every code change that we make having to restart the server down here manually so node Mon helps us to combat that by automatically restarting the server whenever changes are made and saved to our file so first of all let's install node bonnet down here first of all cancel out of the process then to install a package using NPM we say NPM install now if we take a look at the node mom package over here it's going to show us how to install this package so just scroll down and we can see right here it says NPM install - G which means install globally on our computer node one right here so because we're installing something globally on our computer it means we're not just installing it for our current project right here it can be used anywhere on our computer so essentially we're using NPM to install a program globally on our computer right so we can use in different projects in the future as well so let's do that we'll pass in the global flag to say we're installing globally and then the package name which is node 1 press Enter it's just going to take a few seconds to install that package alright then so once that's done instead of writing node server to run this file as we normally would now we can use node montt because we installed that package and then the file name server and this does the same thing it's gonna listen for requests now on port 3000's but now it's set up a live reload server and it's watching our code so if I make a change to about blah and save that then watch down here it automatically restarts the server due to changes we don't have to cancel out of any kind of process and rerun the file it does that for us and if we go over here now we can just go to bounce - blah and this is gonna work so that is a lot easier than before where we had to manually restart the server every time we change our code so that is a package that was installed globally on our computer but what about packages that are specific to our project alright then so the package file is a JSON file and it keeps track of any packages we install locally to our project and other things as well such as project details and any kind of project specific scripts now if you're thinking of using any kind of third-party packages at all in your project then you should definitely create a package JSON file so we do that by coming down to the terminal and saying NPM in it and this initializes as a package JSON file now it's going to ask us a series of questions about our project and it gives us a default value in brackets if we want to accept them we can just press Enter otherwise you can override those by typing in a new one for the most part I'm going to enter through these and just accept the default values because they're all fine but you could fill these in if you want to okay so once you've gone through that it creates us this package JSON file and by the way you should already see a package lock JSON file as well and that file right there keeps track of the different dependency versions that we have installed in our project we don't need to go in and edit anything at all inside that file this file right here keeps track of a few different things about our project such as the name the version all of the different questions that we answered over here we also have some scripts right here that we could run for this project and we might look at scripts a little bit later on but more importantly this package file will keep track of our project dependencies and by dependencies I mean all of the packages we install locally into this project those packages will become things the project depends on hence them being called dependencies so any node project that you create and you will install third-party packages for that project you should definitely create a package JSON file for that project by running NPM in it okay then so now we have that package JSON file right there we can go ahead and start to install packages locally to the project now these packages could be like utility libraries date/time libraries frameworks etc which help us implement extra features into our code and project so what I'm going to do is install a utility library called lodash so if we go to the NPM website and search for this lodash right here and click on that we should see the installation right here so NPM I which is short for install so you can use this instead of the install keyword if you want to save with double dash in front of it and then a low - now this say flag right here this saves it to our local dependencies for this project and that it's going to register that inside the package.json file so it can keep track of that now if you've got a new version of node and NPM you don't need to explicitly use this say flag it's going to install it and save it automatically to our dependencies but if you have an older version then you should use this if you're unsure just use it to avoid any kind of doubts so this is what we're going to install but before we do that let's open up the lodash homepage as well and take a look at the different things we can do if we go to the documentation so you can see we can access a lot of different methods using underscore and then dots so underscore is the lodash library that's what we are required from it when we install it and then when we use that we can use a lot of different methods utility methods from that library so let me go back we'll install this first of all then just try out a couple of the different methods so I am now going to come down here and say NPM install or you can use I and I'm gonna install a low - now I don't need the save flag because I've got a recent version of node so if I press ENTER it's gonna install that locally for me and we can see now inside the package.json file this dependencies object right here and inside that we have low - and the version number so this is keeping track of what package we are using or what packages we are using in this object and it's saying that lodash is one of them okay so let's go ahead and try to use lodash in our code so in server j s the first thing we need to do is actually or require that at the top so I'm going to say Const and then underscore is equal to or require and we want to require low - now node is automatically gonna know to look inside the node modules folder right there which is just magically appeared and that appeared when we installed that local package so whenever we install a local package into our project it's going to create a node modules folder and all of the different files and folders that are needed for that package and the dependencies of that package are going to be kept inside node modules but we don't need to directly go into this folder ever okay they just kept there so what I'm going to do now is try to use this right here lo - and by the way you can call this what you want you can call it lo if you prefer but common practice is just to use the underscore and then down here inside this function right here I'm just going to try using it so let me come right to the top and in fact we'll get rid of this console.log we don't need that anymore and let's do instead a little comment and say a lo - okay so say I want to get a random number lo - provides us with a utility method to do that so I can say Const num is equal to a low - dots and then we use the random method and it can take in two arguments and those two arguments are what we want the number to be between so the boundaries so I could say zero and 20 for example and that's going to get us a random number every time this function runs that is between zero and 20 so let's try and login that to the console console dot log and we'll logout none okay so we need to run this and we're going to use node mana to do that so no daman server and press enter and it crashed it says it's waiting for file changes before starting so something's not quite right unless have a look what that error is okay he says cannot find module load - and that's because I've misspelled it right here it should be a lo - not load - so let me save that again come down here notice it automatically restarts the server when we fix that error so let's go to the browser now and let's go to for example just forward slash and we get the homepage back everything still works but now in the console we can see this random number 17 if i refresh we're going to get a different random number 18 if a refresh again it's gonna be something different 12 so this is pretty nice this is just one of the different methods we can use all right so let's have a look at another one so let me create a function I'm going to say Const greet is equal to some kind of function right here and our function and inside here I'm just gonna say console dot log and then we'll say hello right now imagine I only wanted this function to ever be allowed to run once once only well I could use lodash to do that so in front of this I'm going to say low - dots once which is a method in itself and inside here as an argument we pass the function that we want to execute only once so now if I call the function down here it's going to work but if I call it again it's not gonna allow me to run it twice and we should only see this once logged to the console so if we save that and I hurry flesh over here we can come down here and we see hello only logged at once to the console so that's nice as well and like I said there are loads more different methods we can use with low - but this is not a low - course this is a node course and I'm just showing you how to install third-party packages here if you want to learn more definitely check out the lodash website and you're going to see all of the different methods and properties we can use in the documentation right here okay so there are many other packages that we can use as well as this one and we're going to see much more of them as we go on so another good thing about NPM and the package.json file is that it allows us to easily share project code so imagine I wanted to share all of this project code with friends or colleagues or something then I could email it to them or I could upload it together for them but this node modules folder right here could be absolutely huge with loads of different packages and dependencies inside it now I really don't want to upload that for them for that reason I just want to send them or upload the project code that I writes so if I for example upload all of the project code to github like I've done here for my course files then you're not gonna see that node modules folder and typically people won't do this they won't upload the node modules folder so if I was to download this code by going over here and then clicking on download zip if I unzip that folder then open it up in a text editor I'm not going to see this node modules folder and it's gonna look something like this if I right-click and delete it it's gonna look something like this now if I try to run this let me cancel out of this process and run it again node one server then I'm gonna get an error and that's because it cannot find this module lodash and we're trying to use that right here inside the server file and if we were trying to use other packages as well because we don't have the node modules folder where all of those packages live it's going to error because of those as well so we can't run this at the minute first of all we have to install all of the different packages that this project uses now remember they are listed inside this package JSON file right here under dependencies so we know of the different packages that we need to install and there could be four or five or even more here so we'd have to install all of them now fortunately we don't have to say npm install lo - then npm install something else and something else all separately we don't have to do that when we have a package JSON file which lists the dependencies all we have to do is say npm install and hit enter and that's going to look inside the package JSON file this dependencies property right here and install all of the different dependencies listed right here and that's going to do all of them in one fell swoop so now if we try to run this by saying no daman server and press ENTER then it's gonna work without error so that's another nice thing about the package.json file so if you're ever looking at a project that uses node on github chances are you're not going to see the node modules folder and the same is true for my github course files so if you're trying to view the code for a specific lesson for example lesson a or seven you're not going to see that node modules folder and if you download this then when you open it up in your text editor first of all you need to run NPM install to install any dependencies first and then it will work so then now we know all about NPM and the package.json file and how to install different packages in the next video we're going to install another package called Express and this is a framework for node that helps us to easily create node websites so we're going to learn all about that in the very next lesson
Info
Channel: The Net Ninja
Views: 70,881
Rating: undefined out of 5
Keywords: node.js, node, node js, node.js tutorial, node tutorial, node js tutorial, node crash course, node.js crash couse, node js crash course, crash course, tutorial, install node js, install, node.js introduction, what is node.js, what is node js, what is node, node vs deno, npm, node package manager, npm vs yarn, package.json, package json
Id: bdHE2wHT-gQ
Channel Id: undefined
Length: 16min 49sec (1009 seconds)
Published: Thu Jun 18 2020
Related Videos
Note
Please note that this website is currently a work in progress! Lots of interesting data and statistics to come.