Build and Publish your first NPM package in less than 5 minutes!!!

A lifelong learner. Love to travel. Listen to music.
Search for a command to run...

A lifelong learner. Love to travel. Listen to music.
No comments yet. Be the first to comment.
Source Code Intro Selenium is an automated open source and cross-platform testing tool. It can be used in all major browsers(Chrome, Firefox, Opera, IE, and Edge) using almost all major programming languages. Also, it can be integrated with various ...
Best Practices for Path Structure, Versioning, and Error Handling

Understanding the Performance Implications of async and defer Attributes

Overview static: Default position. It does not allow setting properties like top, bottom, left, right, z-index relative: Acts the same as static. but allows positioning it relatively by putting properties like top, bottom, left, right, z-index absolu...

Overview When an element in the browser has a conflict of styles, the browser uses a set of rules to determine which style should be rendered. This set of rules is defined as CSS Selector Specificity. For instance, for an element, if we have the foll...

Master block, inline, flex, and grid to build better web layouts

Source Code ScreenCast

Here we are going to create a minimal node package. It will contain only two methods.
If you think this is a rocket science, then let's build one and have fun. The most interesting matter is, it would take less than 5 minutes to build and publish one. We will then test out own module using npm package manager.
I also added the source code and video screencast links.
First, we create the package.
Then publish to the Node Package Manager(npm)
Finally, we install the package from npm and test it.
Create an account in npm.
Don’t forget your Username, Password, and Email (LOL !!!).
First, log in to npm in your local machine.
npm login
Put the username, password, and email, you used to create the npm account.
Create a new node project in a new directory.
mkdir magic-directory
cd magic-directory
npm init
Follow the below convention to create the project. For random package name, version or entry point can create issues for publish the package.
As package name, *username-magic-module (it has to be unique, don’t use any special character)*
As for first release version should be 0.0.1
As for the description, This is my magic module
As for the entry point, index.js
Skip the test command for now
Skip the git repo for now
Skip keywords for now
As for the author, put your full name
Skip licensing for now
Make sure your package.json is very much similar to the following package.json, except the name and author property. The name property should have ‘your-name’ prefix.
{
"name": "your-user-name-magic-module",
"version": "0.0.1",
"description": "This is my magic module",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "B M Shams Nahid",
"license": "ISC"
}
touch index.js
So your project directory should be similar to this
├── ...
├── index.js # Project entry point
├── package.json # Project dependency
├── ...
const magicString = () => {
return 'Hello World';
};
const displayMyName = (name) => {
return `Your name is ${name}`;
};
module.exports = {
magicString,
displayMyName
};
Congratulation!!! You just created ypur first node module. Time to publish it.
npm publish
Your node module is published !!!
To find your published package, first, go to npmjs and then from menu, go to the package section.
To test your module,
Create a directory, ‘test-my-magic-module’
mkdir test-my-magic-module
Create node project
npm init --yes
Install your module
npm i your-newly-published-module-name
Create a file named ‘index.js’
touch index.js
Now your index.js file should look like
const myMagicModule = require('myNewlyCreatedModuleName');
const magicStringOutput = myMagicModule.magicString();
const displayNameOutput = myMagicModule.displayMyName('Shams Nahid');
console.log (magicStringOutput);
console.log (displayNameOutput);
Run the project
node index.js
You should see the magic string and the name we provided.
Stay tuned and if there is a confusing term or something, response below. I will replay ASAP.