JavaScript: Countable.js


This article is about a very small, rather unknown, 
but a very powerful JavaScript library which will make your life easy without making your web app unnecessarily heavy.
Well, this may be useful in a use case, where you need to show count of words, characters, 
sentences etc to the end-user which he enters into a text field or to store it in a database for some data analyzing kind of thing.

So let's start with some code:

<input type="text" id='usertext'></textarea>
<script>
  Countable.count(document.getElementById('usertext'), counter =>
    console.log(counter)
  )
</script>

Now you should see:
{paragraphs: 0, sentences: 0, words: 0, characters: 0, all: 0}

With the Countable.count function we get the current state of our text field. 
But if we change anything in it now, the function will not be called again.
The triggering at every change of the content of the text field can be achieved by the Countable.on function

Countable.on(document.getElementById('usertext'), counter =>
  console.log(counter)
)

Whenever we now change the input, we will get the latest counter value. 

About size: gzipped & minified only 1kB large.



Npm: npm install countable


For more details, check out this.

I hope it was helpful.

Written By:
Saurabh Joshi 

Comments

Post a Comment

Popular Posts