[Angular Tutorial] NPM Tutorial – (Node Package Manager) [w/ subs]



00:00:02 – [Music]
00:00:09 – mpm I have been working with angularjs
00:00:11 – and node.js for a couple of months so
00:00:14 – today I decided to make a tutorial on
00:00:16 – NPM what is NPN and how to use NPN and
00:00:19 – PNP each manager and it is used to
00:00:23 – install all kinds of packages that are
00:00:26 – required for over no GS JavaScript
00:00:28 – applications I am working with NPM for a
00:00:31 – couple of months and it really helpful
00:00:33 – in managing and deploying and building
00:00:36 – of our products like we need many extra
00:00:40 – dependency files like we need bootstrap
00:00:42 – we need power we need grunt these are
00:00:45 – all very important packages that are
00:00:47 – required to manage and updating our
00:00:50 – projects so NPM really helped us in
00:00:52 – order to maintain our project we don't
00:00:55 – need to remember that what all the
00:00:57 – modules what are the packages that were
00:01:00 – required and that has to be deleted from
00:01:03 – our project npm automatically takes care
00:01:06 – of all these things it is also used to
00:01:08 – share bundle of packages of a project
00:01:10 – with others who are working on same
00:01:12 – project on another project that needs
00:01:15 – same packages and PM really saves a lot
00:01:17 – of time updating building and decline
00:01:20 – our project so now we are going to start
00:01:23 – working on the practical of NPM in order
00:01:26 – to work with NPM we need to have no jets
00:01:29 – in our system so in order to download
00:01:31 – and install node.js you need to go to
00:01:33 – know jstor org and download the latest
00:01:36 – version of nord jeans once you download
00:01:38 – it you need to install it in your system
00:01:40 – with the default settings and if I go
00:01:43 – right here know it and you can see that
00:01:45 – i already have installed nor jails and i
00:01:48 – have no just c'mon front and no dog j/s
00:01:50 – alright once you install it you need to
00:01:54 – go to CMD command prompt and check out
00:01:57 – if the noting install in your system or
00:01:59 – not you need to write node hyphen V and
00:02:02 – you can see that i have know'd installed
00:02:05 – in my system with a version 4.3 point 1
00:02:09 – alright so i have installed so no JS
00:02:13 – comes with NPM installed with it so in
00:02:17 – order to check if NPM install or not i
00:02:20 – need to enter npn
00:02:22 – if i enter you can see that it has given
00:02:25 – me the details that i have npm install
00:02:27 – of 3.1 odot 9 and this is a working of
00:02:32 – NPN and that is installed in my system
00:02:35 – so in order to update NPM if in case if
00:02:39 – we don't have a latest version of NPM
00:02:41 – what we need to do we need to write npm
00:02:45 – install NPM hyphen G and entry all right
00:02:53 – it's downloading the latest version of
00:02:55 – NPM in case if I have the old version
00:03:01 – already installed with the node so if
00:03:05 – you have internet connection you must
00:03:06 – have internet connection in order to
00:03:08 – install each package are men modules
00:03:11 – with NPM so it's taking some time in
00:03:14 – order to update our NPM so as you can
00:03:17 – see that it has updated my NPM but
00:03:19 – fortunately I already have the latest
00:03:22 – version of NPM it has replaced the same
00:03:25 – version with the same way all right so
00:03:29 – i'll come back to CMD again now let's
00:03:32 – come to the IDE that i use for
00:03:35 – developing node.js applications you can
00:03:38 – use other ideas as well you can see that
00:03:40 – in this IDE I have this terminal it
00:03:43 – works same as CMD so from now on I'll be
00:03:46 – working with this terminal if you don't
00:03:49 – have web store or the terminal inside
00:03:51 – your IDE you can use CMD in case alright
00:03:55 – so you can see that i have created an
00:03:57 – empty project this is called test on my
00:04:00 – desktop you need to create an empty
00:04:02 – folder inside your any directory alright
00:04:05 – so what i need to do is I need to
00:04:09 – install package I have already checked
00:04:12 – that I have NPM install so in order to
00:04:14 – install a particular package in my disk
00:04:17 – in this project what I need to do I need
00:04:20 – to go to install NPM install grunt grunt
00:04:27 – is a package that is the task runner and
00:04:30 – that helps a lot in working with node.js
00:04:33 – projects
00:04:35 – so it's taking some time it's
00:04:38 – downloading grunt package from internet
00:04:40 – it's installing it and is going to
00:04:43 – create no dash module folder under my
00:04:46 – project in order to store those packages
00:04:49 – alright so you can see that it's
00:04:51 – installing right now so you can see that
00:04:54 – there is some warning but just neglect
00:04:58 – this morning and if i go to my project
00:05:00 – you can see that there's a folder node
00:05:03 – underscored modules and here it has
00:05:05 – created all the packages that are
00:05:08 – required to run grunt in my project all
00:05:11 – right it has already created because all
00:05:13 – the packages and modules of NPM needs to
00:05:16 – be inside node underscored modules
00:05:18 – folder so what I need to do is I need to
00:05:22 – check if our packages are working fine
00:05:25 – or not and to be see that I'm going to
00:05:28 – create javascript file and I'm gonna
00:05:30 – name it script all right and for
00:05:34 – checking current I need to do a lot of
00:05:36 – things what I need to do is I am going
00:05:38 – to install another package called
00:05:42 – underscore.js that has a collection of a
00:05:45 – bunch of methods and functions that we
00:05:48 – can use to apply different operations on
00:05:52 – collections on arrays on JSON files and
00:05:56 – on objects so what I need to do is I
00:06:00 – need to come right here in terminal and
00:06:03 – right npm install and underscore
00:06:14 – so if i go to know modules and I just
00:06:19 – come at the bottom and you can see that
00:06:23 – it has installed packages underscore and
00:06:26 – underscore dot strength all right now
00:06:30 – I'm going to use this package in this
00:06:34 – script file so in order to get this file
00:06:38 – what I need to do is I need to create a
00:06:40 – variable I'm going to use the notes in
00:06:43 – text so i'm going to write underscore
00:06:45 – equals to required and underscore the
00:06:53 – name of this folder and what I'm going
00:06:56 – to do is I'm going to use one of the
00:06:58 – function inside this package so i'm
00:07:01 – going to log it so underscore dot i'm
00:07:05 – going to find the minimum number from an
00:07:07 – array so i am going to write five
00:07:09 – numbers and semicolon and in order to
00:07:15 – run it i'm going to go to run click on
00:07:18 – run click on all right so it is showing
00:07:23 – some error actually it is not required
00:07:26 – it is required okay so i'm going to go
00:07:29 – to one again and scrap you can see that
00:07:31 – it has shown one this is the minimum
00:07:36 – numbers are going to use another
00:07:39 – function let's say i want to use find
00:07:43 – all right and i'm going to pass an array
00:07:48 – inside it and this fine function have a
00:07:53 – callback function all right and here i
00:08:00 – need to return if I need to pass a
00:08:04 – parameter inside it and I need to return
00:08:06 – num if this number is a one then return
00:08:14 – that value it will find the first even
00:08:16 – number from this array and return that
00:08:18 – okay so i'll go to run and run script
00:08:23 – you can see that this is the result of
00:08:25 – first console dot log this
00:08:27 – the result of second control dialogue so
00:08:29 – right now I'm not going to teach you
00:08:31 – underscore.js I already made a one hour
00:08:33 – and 10 minutes tutorial and that is an
00:08:37 – essential training goon underscore.js
00:08:38 – check out my current playlist in which
00:08:42 – you are just watching this tutorial in
00:08:44 – order to learn underscore.js alright so
00:08:47 – I just want you to show you that how we
00:08:49 – can download and install NPM package and
00:08:52 – you that you can see that I have used
00:08:53 – this particular package same way we can
00:08:56 – use other packages as well alright so
00:09:01 – now i want to show you that how to
00:09:04 – combine those packages in a file what we
00:09:08 – need to do we need to create a file
00:09:10 – called package dot Jason so I'm going to
00:09:14 – right click on it click on new and in
00:09:17 – webstorm i already have package or JSON
00:09:20 – file i'll click on it if you don't have
00:09:22 – me to create an empty file with an
00:09:24 – extension dot jason and the name of file
00:09:27 – should be same package all right and
00:09:28 – these are the two attributes that are
00:09:30 – required that are necessary in order to
00:09:34 – run package or JSON file it has a name
00:09:36 – and it has the application name so I'm
00:09:38 – going to change it test app and version
00:09:43 – I want to keep the same volume all right
00:09:46 – and there isn't another attribute called
00:09:49 – dependencies and in here we're going to
00:09:53 – write all those packages that we need
00:09:56 – for our project alright and once we add
00:09:59 – those packages inside this dependency
00:10:02 – object we can then ask our NPM that
00:10:06 – check out the package or JSON file and
00:10:09 – inside the package or JSON file there is
00:10:12 – a key called dependency and install all
00:10:16 – those packages that are written inside
00:10:19 – these dependencies all right so I'm
00:10:22 – gonna just go to
00:10:26 – power I'm gonna install board except
00:10:30 – package that is used to fetch all those
00:10:33 – packages for the UI site okay for the
00:10:36 – like bootstrap we have a jquery so in
00:10:40 – order to install it we can also install
00:10:42 – power using NPM install hyphen G bone
00:10:45 – but we are not gonna do it like this we
00:10:47 – have already shown you that how to
00:10:49 – install underscore.js like this hyphen G
00:10:51 – means that we are going to install any
00:10:53 – particular package globally in our
00:10:55 – system we don't need to install later on
00:10:58 – if we create a new project it it was
00:11:00 – already installing your system if we
00:11:02 – create a new project but I created
00:11:04 – underscore.js video hyphen G means it is
00:11:07 – only available in this project alright
00:11:10 – so what I want to do is I want to check
00:11:16 – out the latest version of power so you
00:11:21 – can see that it has a version 1.7 point
00:11:23 – nine alright so what I'm going to do is
00:11:26 – I'm going to add board and i'm going to
00:11:30 – set its value with this character and
00:11:34 – that is 1.7 point nine this is the
00:11:38 – latest William alright and once I add
00:11:43 – all those packages that are required for
00:11:46 – this project I'll go to terminal and i
00:11:50 – will write npm install and i will enter
00:11:54 – it's going to go to package or JSON file
00:11:57 – and install all those packages that are
00:12:00 – written in dependencies so it will take
00:12:03 – some time it will download borrowed from
00:12:06 – internet and if you install it in this
00:12:08 – project so you can see that it has
00:12:11 – installed board 1.7 point nine if i want
00:12:15 – to see that if it is actually installed
00:12:17 – or not let's go to node underscore
00:12:19 – modules and you can see that here is our
00:12:22 – power package it has installed both i'm
00:12:25 – not going to teach you individual
00:12:27 – package because it's in the part of this
00:12:28 – this is not the part of this tutorial so
00:12:32 – I'm just going to teach you and p.m. now
00:12:36 – there is an other another way to create
00:12:39 – this package gorgeous
00:12:40 – five all right so what I'm gonna do is
00:12:45 – I'm gonna write NPN and in it I'll press
00:12:50 – Enter so it's going to ask each and
00:12:53 – every attribute that is required for the
00:12:55 – package or JSON file so i'm going to
00:12:57 – write a name so i'm going to write my
00:13:01 – app and version should be one point one
00:13:05 – point one description let's say test app
00:13:11 – entry point we don't have entry point
00:13:15 – let's enter test command enter git
00:13:18 – repository we don't have we don't have
00:13:21 – keywords I'm the author and let's enter
00:13:24 – the license and i'll press enter alright
00:13:30 – and you can see that it has updated
00:13:33 – package.json file because it was already
00:13:35 – created in this project all right it has
00:13:39 – replaced the name and version with a new
00:13:41 – name it has kept the dependency that was
00:13:44 – already added it has add a description
00:13:46 – it has added the main script file dev
00:13:50 – dependencies script all right something
00:13:55 – so def dependencies and dependency these
00:13:57 – are the two attribute dev dependency
00:13:59 – means that these everything that we add
00:14:03 – inside this object will run only at the
00:14:07 – time of development other than this this
00:14:10 – dependency will work all right so we
00:14:12 – don't need to add two things at one time
00:14:14 – but if it exists it doesn't make any
00:14:17 – problem all right so this is in another
00:14:20 – way to create package.json file and I
00:14:23 – want to show you some more commands of
00:14:25 – NPM so let's say I want to update all
00:14:28 – the packages inside node modules all
00:14:31 – right so what I need to do I need to
00:14:33 – write n p.m. update so it's going to
00:14:36 – check out the individual package and
00:14:38 – it's going to check out if it is
00:14:40 – outdated it's going to update those
00:14:43 – package so it's taking some time now to
00:14:46 – check that out so you can see that it
00:14:49 – has checked all the packages and
00:14:51 – fortunately we have all the packages
00:14:54 – today if there was outdated package it
00:14:57 – have to shown right here all right and
00:15:00 – there is another command called outdated
00:15:03 – in order to check that what are the
00:15:05 – packages are that are outdated so it is
00:15:08 – going to check out and there is no
00:15:10 – outdated project so in order to see that
00:15:13 – what are the package that we have in our
00:15:16 – projects or NPN we're going to write
00:15:18 – listing all right so you can see that we
00:15:29 – have power we have grant we have
00:15:31 – underscore these are the packages that
00:15:35 – we have in our project and there is a
00:15:38 – word called extranas it means that it
00:15:43 – doesn't require but it is added inside
00:15:46 – the node modules because everything that
00:15:48 – we need in to use in our project has to
00:15:51 – be added in dependencies object right
00:15:54 – now we haven't written anything inside
00:15:56 – it alright so that's why it's not
00:15:59 – showing this word after Bauer and it's
00:16:01 – showing after grunt and underscore all
00:16:06 – right so there isn't another command NPM
00:16:09 – in order to uninstall any package
00:16:13 – uninstall let's say I want to uninstall
00:16:17 – ball and i'm going to write say so I'll
00:16:24 – press enter and now I'm gonna enter NPM
00:16:33 – list
00:16:38 – you can see that it has shown grunt and
00:16:42 – underscore because i have already
00:16:43 – installed power but it has been already
00:16:48 – you can see that dependencies object has
00:16:50 – been updated there is nothing inside it
00:16:53 – alright so these are the command that
00:16:55 – you need to know in order to work with
00:16:57 – NPM and these can be very helpful so
00:17:00 – this was all for this tutorial if you
00:17:03 – want to learn more make sure you
00:17:04 – subscribe my channel and ask question in
00:17:07 – comments I will that will really
00:17:09 – encouraged me to make more tutorials I'm
00:17:10 – trying to make angulo
00:17:13 – [Music]


Video Url:
http://youtu.be/NKBFONF2G1M

Comments

comments