Creating and Publishing an NPM package

What is NPM?

If you are a JavaScript developer, you most probably know what NPM is. NPM (Node Package Manager) is an open-source online repository where JavaScript developers create and publish different JS packages to be used by other JS developers. It consists of public as well as paid-for private packages.

In this article, we will see how to create a node package and publish it to npm.

What will we build?
Here, we are mainly focused on the steps to create and publish an npm package, so we won't be building anything that does some complex stuff. We will try to build a Counter, which will take an array or a string as input and will return how many times each unique element occurs in the array or string. It will return a JSON object where each element will be a key and the value for each key will be the number of occurrences of that element.

For example:

Input: ['a','b','a','c','d','b','c','a']

Output:{'a':3, 'b':2, 'c':2, 'd':1}

Before we get started we need to make sure that node and npm are installed on our system. To check, open the terminal and type npm -v and node -v. For each of them, the system will show the version that is installed and if it is not installed it will throw an error stating command not found. If not installed we can install using this guide.

- Create and Initialize the repository: First of all, make a folder and initialize it as an npm project by running npm init. After running npm init, you will be prompted to input certain configuration values like this:

We can either input these values as per our requirement or keep on pressing enter for default values. Then a prompt will come up asking whether the above-entered details are correct. Type yes and press enter.

- Write the project code: After this open up the project folder in a code editor. Inside it there will be a file called package.json which contains the configurations which we mentioned during npm init. Something like this:

{
  "name": "js-counter",
  "version": "1.0.0",
  "description": "A module which will take an array or a string as input and will return how many times each unique element occurs in the array or string",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "Saptarshi Dey",
  "license": "MIT"
}

Now create a file named index.js. This will be our main file and here we will write the function which will perform our required task. Below is the code as per our requirement:

function Counter(input){
    var result = {}
    len = input.length
    
    for(i=0;i<len;i++){
        if(result[input[i]]){
            result[input[i]]+=1
        }else{
            result[input[i]]=1
        }
    }
   
    return result
}
module.exports={Counter}

- Publishing the package: To publish the package we first need to authenticate. For that go to the terminal and type npm login. Then enter your username and password when prompted. If you do not have an npm account, you can create it here.

Now after logging in we can publish the package. One thing to watch out for is the name of the package. The name of the package is mentioned in package.json and if any package with the same name already exists in the npm registry we cannot publish our package. Here are the package name guidelines. If the name is unique we can publish the package just by running npm publish.

After publishing is successful, you can visit your account in the NPM registry to see the package.

- Testing: To test the package we have to install the package. First, create a repository and install the package.

#create a test repository and navigate inside it mkdir test-package cd test-package #install the package npm install js-counter #create a index.js file touch index.js

Then inside the index.js you can write the following code to test out your package:

const counter = require('js-element-counter')
console.log(counter.Counter([1,2,1,2,2,3,4,1,2]))

You will get the output as:

{ '1': 3, '2': 4, '3': 1, '4': 1 }

This was a basic step to create an npm package. To this, you can add a proper README file stating the usage of the package with some examples.

Here is a detailed video of the steps mentioned above:

Now as you know to create and publish your own npm package, dive in to create some cool packages and publish them, who knows your package might become helpful for some other developer out there!