ahmad-raza-blogs

Let's use a js package 🎁

a package adds more functionality ⚒️ to your project

Ahmad Raza's photo
Ahmad Raza
·

3 min read

Table of contents

🚩 we would only discuss about javascript packages

What is a package? 🤔

It is a piece of code written by some smart people which does something. If you want that functionality without writing all the code by yourself, you can use that particular package.

for example 🖊️

you are creating a website and at some point, you need to check if the email entered by the user is valid or not,
You have two potential ways,

  • either you write a function by yourself
function isEmail(emailString) {
    // check for @ sign
    var atSymbol = emailString.indexOf("@");
    if(atSymbol < 1) return false;

    var dot = emailString.indexOf(".");
    if(dot <= atSymbol + 2) return false;

    // check that the dot is not at the end
    if (dot === emailString.length - 1) return false;

    return true;
}

isEmail('awe@some.com'); // => true
  • or use a package
var validator = require('validator');

validator.isEmail('awe@some.com'); //=> true

How to start using a package? 🧑‍💻

Prerequisites

Lets start from scratch 💫

  • Create a new folder hello-packages anywhere on your computer

  • Then open a terminal in that directory

  • run the command

npm init -y
  • Now its time to install the package
  npm install validator
  • create a file index.js and paste this code in that file
const validator = require('validator');
console.log(validator.isEmail('some@thing.com'));

At this time, your directory should look like

/**
* hello-packages
* -- node_modules
* -- index.js
* -- package-lock.json
* -- package.json
*/
  • run the code inside index.js file
 node index.js
  • output you will get is
true

check this out to explore more features and functionality that validator package can offer.

check this out to know what a package.json file is

Using a package in a project that doesn't use modules but static HTML files

you can use their cdn https://unpkg.com/validator@latest/validator.min.js

<script src="https://unpkg.com/validator@latest/validator.min.js"></script>

Add a script tag in your HTML head with cdn url.

How to check what features and functionality a package offer? 🪶

Most of them have great documentation.
or you can check out their GitHub repositories.

Who writes these packages? 🧠

Smart people like you and me.
Most of the packages are free to install, and you can contribute to their GitHub repos.

What is npm?

npm stands for node package manager.
It is a command line client. which means that you can use it to

  • install a package npm install validator

  • uninstall a package npm uninstall validator

  • publish a package npm publish

  • and a lot more npm -h

It is also an online database of public and paid-for private packages, called the npm registry.

Source code: All the codes used in this blog. 😊

packageJavaScriptWeb DevelopmentBlogsWithCC