Introduction
NPM is an essential tool for JavaScript developers for managing versatile packages in the node.js ecosystem.
While I was learning Tailwind CSS and Node.js, I came across this term "NPM" and this made me pretty curious.
So I decided to dive deep into the concept usage and working of NPM
In this article, we will explore the basic concept of NPM
So, let's dive into it.
What is NPM?
So before we move further let's understand What is NPM.
NPM stands for Node Package Manager. It is the main and default package manager for the JavaScript runtime environment Node.js
Not clear enough?
Let's break it into much simpler words
It is a huge repository containing numerous open-source software that can be used by anyone for free.
Why do we need NPM?
Now the question that arises in our mind is why do we actually need npm?
Let's understand this using an example. Assume that we are building a laptop. Is it possible to build all its components from scratch and then assemble all the components to build a laptop?
No right?
As it will take a lot of time and is also not worth it. Instead, we just take the pre-built components and assemble them to make a laptop which makes the process much easier and faster
NPM helps us in a similar way. It makes writing code easier as we can use pre-built code written by other authors
Other authors write their code for their package and publish it on the NPM registry. We can then use the code by installing it on our machine using NPM CLI(Command Line Interface). All kinds of packages are present in NPM from single-purpose ones to large libraries.
Now to use NPM we need to know how to install NPM on our machines.
Let's look into that
Installing Node.js
Step 1: Go to the website https://nodejs.org/en/download
Select the required version, the OS, and click on download.
Now download it and complete the setup.
Tip: Avoid choosing the latest version as it might contain bugs
Step 2: Run the following commands on your terminal and check if Node.js was installed.
The command node -v
and npm -v
will return its latest versions.
If it's not working then try restarting your system and it will work.
Now let's look into the process of installing npm packages
Installing NPM Packages
In this step, we will install the required NPM package.
For that first clone any repository and open it in your code editor
Now open the terminal and run the following command
npm init -y
Note: Here -y is used to automatically answer "yes" to all prompts. Thus preventing us from doing it manually.
You will see a package.json file was created.
We will be looking into the usage and details of this file further
In a nutshell, package.json
file contains the details about the dependencies and packages to be installed on running the required npm command
On running the command npm install
it will create a node_modules folder and install the required packages and dependencies as mentioned in the package.json file inside the node_modules folder
It will also create a package-lock.json file. In the further sections, we will be looking into the details of the package-lock.json file.
We can also use the following command to only install the specified and required packages and their dependencies in the node_modules
After installation, it will automatically get pushed into the package.json file
npm install <package name>
What we have been doing till now is installing local packages but there is also something termed global packages that can be installed and used
Now we will see the difference between local packages and global packages
Local Package v/s Global Package
Let's understand the difference between the local package and the global package.
Local packages: These packages are installed in the directory where we run the npm install <package name>
command. These packages are not available for other projects or other directories.
Global packages: These are installed in our system in a specified location and can be used in any directory or any project present in the System.
We can install these global packages using the command
npm install -g <package-name>
And, we are ready to use the installed packages and work with them.
Now, we will be looking into the use and details of the "package.json" file and "package-lock.json" file.
About Package.json File
It is important to know the uses and details of these files. So, let's learn about the package.json
file.
Package.json file stores all the data about the project.
It contains :
name
-> name of the projectversion
-> The current version of the projectdescription
-> The description of the projectmain
-> Specifies the file that is the main entry point of your projectscripts
-> This includes the command associated with your project like the command for building, running, or testing the projectdependencies
-> This is where all the required packages are listed that are required to run the project. These are installed in your system using npm installdevDependencies
-> This contains the modules that are required only during the development not in the productionrepository
-> Specifies the type of version control we are using and the url of the repositorykeywords
-> These are the array of strings that contain the keywords of the projects that help people discover the projectauthor
-> The name of the author of the projectlicense
-> the license type of the project
A sample package.json
looks like this
About Package-lock.json File
Now when you are installing the packages you may have noticed that it also creates a package-lock.json
file.
This file contains the records of actual specific versions of each package and dependencies installed on your local system
This file helps us to install the exact version of the packages and dependencies despite any update in version in between the phase when the file was created and when it was installed locally.
This is the main function that this file performs
Apart from this, It speeds up the installation process -> without the package-lock.json
file before installing npm has to request the registry for each package to see if there are new versions available.
With package-lock.json
npm knows the exact version to install and thus it speeds up the installation process
These were the basic usage of the package.json
file and the package-lock.json
file
Conclusion
This was all we needed to know about NPM Packages to have a basic clear understanding.
I hope I made it simple for all.
If you found this blog useful and insightful, share it and comment down your views on it.
Do follow for more such content.
Here's how you can connect with me.
Email - olibhia0712@gmail.com
Socials: Twitter , LinkedIn and GitHub
Thanks for giving it a read !!
Top comments (10)
Awesome Share! The fact you used analogies and dealt with every single term is a big W. There's more to backend, and keep sharing as you learn! Best of Luck!
Thanks!
Glad you liked it🙌
Nice Post. Thank you
Glad you liked it!
Can you explain about "npm ci" command
It deletes the existing
node_modules
directory and installs the dependencies from thepackage-lock.json
.When I install some packages, they mostly show me the number of vulnerabilities in them. What is that?
These vulnerabilities are potential security risks identified in the dependencies of the packages you're installing.
Awesome!✨great content!👏
Glad you liked it🙌