Publishing an NPM Module Part 2

These are my notes based on the phenomenal tutorial by Kent C. Dodds hosted by egghead.io both of which are my go to sources when I want to learn something new. I highly suggest you sign up for the pro subscription.

Part 1 | >Part 2 | Part 3 | Part 4 | Part 5 | Part 6 | Part 7

Part 2: Creating the library

If you missed it check out Part 1: The Setup

This is going to be a tough section. I will be using my module as an example but you will need to create your own. I was inspired by the original tutorial on egghead.io that I can’t recommend enough! Kent C. Dodds is absolutely fantastic. I have a cousin who is an author and one of her issues was coming up with names so I created my random-character-name module to help her out.

The initial step is the same, at the console inside your projects directory type:

$ touch src/index.js

For mine I am also going to use another library in mine called unique-random-array. I also created a data directory to hold my first, middle and last name json objects.

$ npm i -S unique-random-array

glyphicons-499-sunglasses  npm i -S is equivalent to npm install –save

Here is the inital code for my project.

var uniqueRandomArray = require('unique-random-array');
var _ = require('lodash');

//define available data
var firstNames = require('../data/first-names.json');
var middleNames = ('../data/middle-names.json');
var lastNames = ('../data/last-names.json';

//random generators
var randomFirstName = uniqueRandomArray(firstNames);
var randomMiddleName = uniqueRandomArray(middleNames);
var randomLastName = uniqueRandomArray(lastNames);

//filter functions
var filteredNames = function (nameList, initial) {
    return nameList.filter(function (name) {
        return name[0] === initial;
    })
};

module.exports = {
    list: list,
    single: single,
    numberOfNames: numberOfNames
}

//available methods
function list() {
    var allNames = ["FirstName MiddleName LastName"];
    for (var i = 0; i < firstNames.length; i++) {
        var tmpName = randomFirstName() + ' ' + randomMiddleName() + ' ' + randomLastName();
        allNames.push(tmpName);
    }
    return allNames;
}

function single() {
    return randomFirstName() + ' ' + randomMiddleName() + ' ' + randomLastName();

}

function numberOfNames(number) {
    if (number === undefined) {
        number = 1;
    }
    var allNames = [];
    for (var i = 0; i < number; i++) {
        //Math.floor((Math.random() * 10) + 1);
        var tmpName = randomFirstName() + ' ' + randomMiddleName() + ' ' + randomLastName();
        allNames.push(tmpName);
    }
    return allNames;
}

Now, just because we have a thing lets commit that thing!

git commit -am “Initial Commit”

Publish to NPM

Now is the exciting part! We will publish to NPM! Head to your friendly console and type:

$ npm publish
$ npm info the-name-of-your-repo

Let’s do a quick test, we will jump to your Desktop and try it out!

$ cd ~/Desktop
$ mkdir npmtest
$ npm init -y
$ npm install the-name-of-your-package

Now anyone with npm installed can install your package! I was giddy the first time this hit me. Since we really have something now so let’s set our version to 1.0.0 on github.

$ git tag 1.0.0
$ git push --tags

glyphicons-28-search   This a great read if you want to take a closer look.

Head to your https://github.com/repo/releases and you will see the version 1.0.0 tag. Also head to https://www.npmjs.com/package/the-name-of-your-package to check it out! You are a contributor now! (send me a link and I will star you)

Releasing a new version

Add a new feature to index.js. Here is an example. We have added a new function to return a name with specific initials.

function startsWithLetter(f, m, l) { 
    var firstName = _.sample(filteredNames(firstNames, f)); 
    var middleName = _.sample(filteredNames(middleNames, m));
    var lastName = _.sample(filteredNames(lastNames, l));
    return firstName + ' ' + middleName + ' ' + lastName; 
}

We also want to make sure we export our new function.

glyphicons-424-git-create
module.exports = {
    list: list,
    single: single,
    startsWithLetter: startsWithLetter,
    numberOfNames: numberOfNames
}

Since this is not a breaking change and is not just a bug fix we will change the middle number.

glyphicons-28-search  Read about semver at http://semver.org/ but a quick rundown is as follows:

major(breaking).minor(non-breaking new feature).patch(bug)

$ git status
$ git diff
$ git add -A
$ git status
$ git commit -m "[feat] add startsWithLetter method."
$ git tag 1.1.0 //set new version
$ git push
$ git push --tags
$ npm publish
$ npm info the-name-of-your-package

Pushing Beta Version

Make a change. Something you are not sure you want in the default download.  I just added a bunch of comments, nothing serious. 

$ git diff
$ git add -A
$ git commit -am "[docs] add verbose documentation in comments"
$ git tag 1.2.0-beta.0
$ get push
$ git push --tags
$ npm publish --tag beta

To install beta

$ npm i the-name-of-your-package@beta

Or a specific version:

$ npm i the-name-of-your-package@1.2.0-beta.0

Next… Setting Up Testing

Key:

glyphicons-55-clock  = Time Saving Idea

glyphicons-499-sunglasses = Pro Tip

glyphicons-31-pencil = Note

glyphicons-197-exclamation-sign = Alert

glyphicons-424-git-create = Code Update

glyphicons-28-search  = A Closer Look