DEV Community

Boris Joskic
Boris Joskic

Posted on

Published my first NPM package that actually does something

Yesterday morning I was playing a bit with some personal project, and found myself having to add a simple loader. Nothing complicated, but I just wanted to do it a different way.

Could I create a package that I could reuse after? Sure.

Got an idea how I could do it, so just opened StackBlitz and started playing with it. It was working fine, and was doing what it's supposed to do.

What is it?

Just a simple JavaScript library for displaying and hiding loaders.

Why?

Why not? It was fun to make, and I could use it anytime I want to.

Usage

It's pretty simple. You initialize a loader, and send id of element where you want it to be displayed and type of loader as parameters.

let loader = new Loader('app', 'standard');

// show loader
loader.show();

// hide loader
loader.hide();

Currently, there are 4 different loaders, but I will probably add more.
You can check it out at github repo.

Nothing complex or new, but it was fun to make and play with it.

Top comments (5)

Collapse
ย 
dance2die profile image
Sung M. Kim โ€ข โ€ข Edited

Hi Boris,

What is "loaders" in this context?

Btw, Thank you for the NPM status in README.
I copied and modified it for my own library :p

Collapse
ย 
brsjsk profile image
Boris Joskic โ€ข

Well, when I say loaders, I mean like a indicator that something is happening. In other words, just a spinner.

No problem, at least it was useful for something :D

Collapse
ย 
dance2die profile image
Sung M. Kim โ€ข

Thank you, mate.

What I thought initially was WebPack loaders but it didn't make sense with the JavaScript code. :)

Collapse
ย 
brsjsk profile image
Boris Joskic โ€ข

Fixed some issues, so it's now safe to be used in projects :D
Added a build scripts that minifies CSS, compiles JS to ES2015 and uglifies it, and outputs it to the dist folder. Much better

Collapse
ย 
bennypowers profile image
Benny Powers ๐Ÿ‡ฎ๐Ÿ‡ฑ๐Ÿ‡จ๐Ÿ‡ฆ โ€ข

Sounds like these would be excellent as web components