Writing Your Own Custom Mouse UI Class In Vanilla JavaScript

By making my own custom Mouse class I was able to build on top of it to implement all of the following completely custom UI controls — including the re-sizable and draggable toolbar itself.

Manipulating CSS elements using a simple JavaScript Mouse class explained in this UI tutorial.

Information overwhelm is a real problem for new coders.

If you are learning how to code but doubting whether you are learning “the right subjects” (you know, the ones that buff up your experience and bring you one step closer to becoming employable) look no farther than the mouse class.

If you haven’t programmed your very own mouse class yet — you should.

Here are the top reasons to write your own mouse class:

1. It’s Primal — Everything we do in UI space is based on mouse movement.
2. It’s Re-usable — Write once, deploy in any project (even at work.)
3. It’s Practical — I can’t count how many things you can build based on it by having the mouse class in your arsenal of re-usable modules.
4. It’s Reputable — Publish it to GitHub. Next time someone asks: “Why not just download an NPM module for that?” You can say: “Thank you, thank you very much, but I am a real programmer and tons of people are already downloading the one I wrote. It’s how I got my current employer’s attention.”