My Experience in Building the First NPM Package

What was my inspiration for Building an NPM Package ??

Before I discuss what NPM is and how I created my first NPM package. I want to mention that I have been working in web development for more than two years. I have been considering creating my own NPM package for the past year. My first inspiration came from a Traversy Media video on the NPM Crash Course, which offered me the notion that we might create our own package.

I wanted to make an NPM Package mostly so that I could experiment with something new and learn and explore new things in web development. when the idea of creating a bundle first crossed my thoughts. After doing some research, I decided to construct a package for object methods and titled it objectmethods.

So let us start just with the main question !!

What is NPM ??

NPM stands for Node Package Manager. It is a Package manager for JavaScript. It is the default package manager for the JavaScript Runtime environment Node.js. NPM Registry has more than 20 Lakh Packages. Most of the famous JS developers believe that there is an NPM Package for everything.

Before Going into how to build/publish an NPM package. I want to discuss why I wanted to create the NPM Package for Object Methods. There are many built-in methods for arrays when compared to objects. So I thought of building a package which will contain some methods for JS Objects as well. There are methods already for JS objects but they are complex so the idea was to make it a package which can be easily used and also useful.

Steps Involved in Building an NPM Package

Prerequisites

Before Building the NPM Package all we need is the NPM Command Line Tool. npm is distributed with NodeJS, So to use npm all we need to install is NodeJS then automatically npm will be installed.

Step 1: Create an NPM Account

First Come First We need to create an NPM Account. Click Here to create one. Once your account is created make sure you verify your account without verifying the account the package cannot be published.

Step 2: Create a Git Repository with a ReadMe file

Create a Public GitHub Repository with the Repository name as the name of the package you want to create with a ReadMe File. Once the Repository is created clone the Repository.

Step 3: Create a package.jsonfile

Next, We will be creating a package.json using

npm init

with the following settings:

1. Package Name: Name given to your Package. This name should be unique. (Check the NPM website if the package name is already taken )
2. Version: 1.0.0 (Default Version of the Package)
3. Description: This will appear on the NPM Page and this will describe the NPM Package
4. Entry Point: This will be the starting point of the package. Through this file, the package starts (Default index.js)

5. Test Command: You can leave this blank

6. GitHub Repository: This will contain the GitHub Repo Details. Since the Repo is already cloned the GitHub repo URL will be already added.

7. Keywords: Keywords using which the packages can be found.

8. Author: Mention the Authors of the Package.

9. License: ISC (This is the boilerplate license for open-source software).

Step 4: Create the functions of the package in the index.js

Now let us create a index.js and inside this, we need to enter the functions of the packages and need to export the package.

so let us consider a function which tells the length of the object and export the function using module.exports

// Find the length of the Object
function len(obj){
var length=0
for (key in obj){
length++
}
return length
}
module.exports.len=len

Step 5: Test the Package

Before Publishing the package one of the main steps is to test the package. To test the package we need to install the package locally. So we need to write the command npm link in the terminal of the package folder. This will make the package ready to be installed anywhere locally.

To use the package we need to create a test folder and then install the package locally. To install the package we need to use the command

npm link package_name

This command will install the package name locally in the test folder and to test the package we need to create a script.js

After creating the file we need to import the package and then use the function inside to get the result.

Sample Code for the given function

const ObjectMethods=require("objectmethods")
let a={k:'1',s:'3',b:'hello'}
let b;
b=ObjectMethods.len(a);
console.log(b)

To run the sample code enter the command node script.js

Once the sample code runs as per the requirement giving the correct result. The next step is to write a description of the package.

Step 6: Adding a ReadME.md File

Now you might have noticed the documentation that was included on the npm page. To create our own, we just need to make a README markdown file called README.md

We can then insert markdown syntax to explain the installation and usage of our package. This File should contain details on how to use the package.

Step 7: Publish the Package

To publish the package first we need to login into the NPM Account to login run the command npm login and then enter the username and password once the login is successful. To publish the package run the npm command

npm publish

If the Account is not verified then there are chances that your package won’t be published.

Step 8: Modification the Package and Republishing the package

If any changes are done to the package once the changes we need to repeat Steps 4,5,6 and the package is ready. To republish the package we need to run the command

npm publish version_number

Any reason you want to unpublish the package, this can be done with the command

npm unpublish package_name -f

This package will unpublish the package and when you search the npm page this will through a 404 Error.

Conclusion

I hope you have learned something new about npm and how to publish your own npm package from this post. If you have any feedback, questions or suggestions. Please Let me know in the Comments.

If you would like to read this post, then follow me on Twitter, Follow my Insta Tech Page for more such content.

Thanks for Reading,