In this tutorial, we will learn everything about NPM, npm scripts & packages, as well as, latest npm packages that developers to become more productive developer.

Since Node.js was created, it has been sweeping the globe. Node.js has been used to build hundreds of thousands of systems, prompting the developer community to claim that JavaScript is eating software.

The popular package manager npm, which allows JavaScript developers to share useful packages, is one of the main reasons for Node's success.

There are millions of npm install per day, but as a beginner, we often don't know, What is NPM, and How to use it? That's why, I'm writing this tutorial.

This article was originally seen at DeveloperNoon.com.

What is NPM?

Using npm efficiently is a cornerstone of modern online development, whether it's solely for Node.js, as a package manager or build tool for the front-end, or as part of processes in other languages and platforms.

For a newbie, really grasping npm as a tool, understanding the underlying principles, can be challenging - I spent a lot of time trying to figure out minute nuances that others would consider insignificant or take for granted.

NPM is divided into two parts:

1. Online repository for JavaScript packages.

2. CLI (command-line interface) application for installing packages.

How NPM Dependencies are Delivered to Developers?

The npmjs.com fulfillment center employs an army of dedicated servers, who will be assigned as personal assistants to each npmjs.com customer to help with this process.

As a result, dependencies are supplied to JavaScript developers in the following format:

and the procedure for publishing a package for your JS friends would be as follows:

That's how, NPM delivers the desired packages to JavaScript developers quickly.

Guide to package.json

The package.json file is a manifest of your project that includes information about the packages and applications it depends on, as well as special metadata like as the project's name, description, and author.

The package.json file can seen as a Passport, with all the information about the user. This file is also send with the NPM package to the developer.

When npm init is used to start a JavaScript, or Node.js project, package.json is also created with it.

Metadata of Package.json

Whether it's a web application, a Node.js module, or a simple JavaScript library, you'll nearly always discover metadata particular to the project inside a package.json.

Metadata aids in the identification of the project and serves as a starting point for users and contributors seeking information about it.

There are several types of metadata in package.json:

1. name: The name of the package choosed by author.
2. version: Version displays the version of the package, you are using. Initially, it is displayed as 1.0.0.
3. description: Description contains the description of the package, written by the author.
4. license: The Project's License is stored on the license data of the package.

Another important thing that we find is NPM fund. You can find a complete guide for npm fund on Developer Noon.

If you visit your package.json, you will see all the information about the package, this data is shown as:

{
  "name": "Developer Noon",
  "version": "1.0.0",
  "description": "#1 Programming Tutorials
  "main": "index.js"
  "license": "MIT"
}

How to edit package.json file

To update your package.json file, you just need to go the file in your code editor, preferably Visual Studio Code, and change the name, description, version, and license. After that, you can again push your package.

Dependencies and devDependencies in Package.json

The —save and —save-dev flags on the npm install command are used to install dependencies. They're intended for use in both production and development & test environments.

Meanwhile, it's critical to comprehend the possible signs that precede the semantic versions:

• ^: the most recent minor release If version 1.3.0 is the most recent minor version in the 1 major series, a ^1.0.4 specification might install it.

• ~: the most recent patch release ~1.0.4 specification may install version 1.0.7 if that is the most recent minor version in the 1.0 minor series, just as ^ does for minor releases.

Learning with examples is always a better way to learn. Let's hop in some of examples of Dependencies and devDependencies. Here is an example of Dependencies, that you will find on any Package:

{
  "dependencies": {
    "@actions/core": "^1.2.3",
    "@actions/github": "^2.1.1
}

That's how, you will find dependencies on the package.json file.

Now, let's hop in how the devDependencies file looks like in your package:

{
  "devDependencies": {
     "@types/jest": "^25.1.4",
     "@types/node": "^13.9.0",
     "@typescript-eslint/parser": "^2.22.0",
     "@zeit/ncc": "^0.21.1",
     "eslint": "^6.8.0",
     "eslint-plugin-github": "^3.4.1",
     "eslint-plugin-jest": "^23.8.2",
     "jest": "^25.1.0",
     "jest-circus": "^25.1.0",
     "js-yaml": "^3.13.1",
     "prettier": "^1.19.1",
     "ts-jest": "^25.2.1",
     "typescript": "^3.8.3"
     }
}

There is a significant distinction between dependencies and the other common components of a package. The difference between Dependencies and package.json is that they're both objects with multiple key & value pairs.

Every value in both dependencies and devDependencies is the version range that's acceptable to install, and every key is the name of a package.

What is package-lock.json

The exact versions of the dependencies used in a npm JavaScript project are described in this file. Package-lock.json is an ingredient table, whereas package.json is a generic descriptive label.

Package-lock.json is similar to how we don't usually read the ingredient table of a product.

Developers are not supposed to read package-lock.json file line by line. The npm install command generates package-lock.json, which is also read by our NPM CLI tool to ensure that build environments for the project are replicated with npm ci.

Introduction to basic NPM commands

There are tons of npm commands that are here to facilitate developers. Some of the most important, mainly npm install, npm ci, and npm audit to be specific:

1. npm install

npm install <package-name> will, by default, install the most recent version of a package with the version sign. In the context of a npm project, a npm install will download packages into the project's node modules folder according to package.json specifications, upgrading package versions where possible based on and version matching.

If you want to install a package in the global context that you can use anywhere on your machine, you can use the global flag -g.

Because npm has made installing JavaScript packages so simple, this command is frequently misused.

2. npm ci

So, if npm install —production is best for a production environment, is there a command that is best for my local development and testing environment? npm ci is the way to go.

Similarly to how package-lock.json is generated whenever npm install is called if it doesn't already exist in the project, npm ci uses this file to download the exact version of each individual package that the project depends on.

This is how we ensure that the context of our project remains consistent across machines, whether they are our development laptops or CI build environments like GitHub Actions.

3. npm audit

NPM packages are vulnerable to bad authors with malicious intentions due to the large number of packages that have been published and can be easily installed.

The npm.js organization came up with the idea of NPM audit after noticing a problem in the ecosystem. They keep track of security flaws that developers can check their dependencies for with the NPM audit command.

NPM audit informs developers about vulnerabilities and whether there are any versions with patches to install.

How to Instantly Initialize a npm Project

You can use the --yes flag on the npm init command to automatically populate all options with the default npm init values, if you want to get on with building your project and don't want to spend the time answering the prompts from npm init.

You can simply use this command to instantly initialize your npm project:

npm init --yes

How to Install Modules with npm install

When you're first getting started with npm, one of the most basic things you should learn is how to install modules from npm.

As you learn more about installing modules, you'll notice some differences, but here's the gist of what you need to know to install a standalone module into the current directory:

npm install <module>

Replace with the name of the module you want to install in the above command.

Conclusion

This guide helped you with getting starting with NPM, and some useful commands for beginners to know before getting started.

NPM helps you to Take your JavaScript development up a notch, according to npmjs.com. You can look into the documentation of npm to learn anything more about new npm technologies.

Thanks for Reading! Subscribe to our newsletter.