Overview

This is a suggested workflow for building npm modules locally. We'll be building an input validation utility, but the principles can be applied to any library. Input validation is a common challenge for UI developers, and it's important to handle it consistently. This makes it a really good candidate for an npm module. So let's build a small library!

ASSUMPTIONS & EXPECTATIONS

This tutorial is designed to walk you through a good workflow as you develop an npm module. The example is fairly simple, but there are lots of good principles, practices, and tooling built-in. Those are really what I want you to take away from this exercise. I'm assuming you've never built an npm module before, but you'll need to be fairly proficient with JavaScript, familiar with npm, and comfortable using the command line to get the most out of this tutorial. I'm also assuming you're familiar with git and GitHub. However, if you don't want to code-along, you can certainly review the snippets in the article. Our playground app for integrating this library is a React app, and it would be helpful to have some knowledge of React. That said, our library isn't dependent on React, and you won't really need any React-specific knowledge to complete this. I'll use Yarn for my examples here, but you can certainly use npm if you'd prefer.

Many of the tools and tricks I'll show you do the same thing: automate manual effort. This allows you to focus on building a useful library instead of fumbling around managing configuration and processes.

Up & Running

I created a starter repo on Github to help with the setup and configuration. Go ahead, pull it down and install the dependencies: