Creating an NPM Package: From Company Utility to Public Module with 555 Weekly Downloads

Introduction

In the fast-paced world of software development, converting a utility that was initially used internally in a company project into a public NPM package can be a strategic decision. By doing so, not only can you streamline the codebase of your projects, but you also contribute to the open-source community while gaining visibility and traction for your own company. In this article, we will walk through the step-by-step process of converting a "formatPrice" utility used in our fintech app called re:current into an NPM package, resulting in an impressive 555 weekly downloads.

1. Understanding the Utility

Our fintech app, re:current, focused on real estate, requires the ability to convert numerical amounts to Nigerian Naira (₦). Initially, we had a simple function called formatPrice, embedded within our codebase. The function would take a numerical input and return the corresponding value in Nigerian Naira, using the correct currency format.

import { formatPrice } from 'formatnumber-to-naira';

const price = 1234567.89;
const formattedPrice = formatPrice(price);
console.log(formattedPrice); // Output: "₦1,234,567.89"

2. Code Isolation and Unit Tests

Before we convert the utility into an NPM package, it is essential to isolate the utility function from the app's codebase and write comprehensive unit tests to ensure its correctness and robustness. The isolation step will help prevent any unintended dependencies on other parts of the app and ensure the utility remains self-contained.

3. Initializing NPM Package

Now, let's get started with creating our NPM package. First, we need to initialize the package with the npm init command. This will generate a package.json file that stores metadata about our package, including its name, version, author, and dependencies.

npm init

Follow the prompts and fill in the required information to create the package.json file.

4. Structuring the Package

Next, we need to structure our NPM package appropriately. A typical structure includes a "src" folder for the source code and a "test" folder for the unit tests. Additionally, we'll need to create an index.js file in the root of the package that will serve as the entry point for our module.

The directory structure should look like this:

- package.json
- /src
  - formatPrice.ts
  - index.ts
- /test
  - formatPrice.test.ts
- tsconfig.json

5. Implementing the Package Logic

Move the isolated formatPrice function into the src/formatPrice.js file. Update any references and dependencies within the function to make it self-sufficient. Ensure the function remains compatible with various input scenarios and handles edge cases effectively.

6. Writing Comprehensive Unit Tests

In the test/formatPrice.test.js file, write comprehensive unit tests using a testing framework such as Jest. These tests should cover various input cases and verify that the function produces the correct output for each scenario. Proper testing is crucial to ensure the utility's reliability and maintainability in the long run.

7. Exporting the Function

In the index.js file, export the formatPrice function from the src/formatPrice.js module using CommonJS or ES6 module syntax. This will make the function accessible when the package is installed in other projects.

8. Publishing to NPM

Once the package has been implemented and tested thoroughly, it's time to publish it to the NPM registry. Use the following command to publish the package:

npm publish

Note: Before publishing, ensure that you have an NPM account and are logged in using npm login.

9. Updating and Maintaining the Package

After publishing the package, it becomes available for public use. Users from all around the world can now install and incorporate it into their projects using npm install. It's essential to monitor the package for issues and updates, respond to user feedback, and address any bug reports promptly to maintain a healthy package ecosystem.

Conclusion

In this article, we discussed the process of converting an internal utility used in our fintech app re:current into a public NPM package. By releasing our "formatPrice" utility as an NPM package, we not only streamlined our app's codebase but also contributed to the open-source community. We hope this technical and detailed guide inspires other developers to share their useful utilities with the world, enabling innovation and collaboration in the development community.

Do well to give us a star on our GitHub repository and check the NPM package using the links below:

GitHub Repository
NPM Package

Happy coding!