This is the first part of a series based on "ToolJS". This part covers the introduction, installation and a bit of the usage.

What is ToolJS

ToolJS is an open-source dependency free library built from the ground-up using plain old javascript, that aims at simplifying the workflow of any developer working in a javascript environment.

It is basically a collection of functions and methods that as a javascript developer, or a front-end developer, will prove useful in development circle.

It comprises of functions that manipulates strings, objects, numbers, DOM elements and even mathematical methods. Think of it as Lodash and JQuery all in one.

This functions are categorized into modules, which can be used independently. The libraries first release comes with six(6) modules which include "DOM", "Obj", "Str", "Num", "Calc", "Util"

Where can it be used

ToolJS was written to ease the working javascript in both Node.js and browser enviroment, which means it offers a version for both.

Installation

ToolJS supports both Node.js and browser environment as do most javascript libraries, which means there is an installation means for both environments.

For Node.js

ToolJS comes with an npm package.

npm install @redeakaa/tooljs

For Browser

Simply include the following script tag below in your html

<script src="https://unpkg.com/@redeakaa/tooljs@1.0.1/dist/umd/tooljs.min.js"></script>

If you want to us ES6 import syntax then, you make your imports from the CDN below

https://unpkg.com/@redeakaa/tooljs@1.0.1/dist/esm/tooljs.esm.js

Usage

The usage is same for both environments, but only depends on how you include the ToolJS library into your work environment

For Node.js, you are required to...well, require😂 the package in your code after installing.

(Note that the npm package and the ESM version of the library uses both named and default exports).

To include the libraries default export

const ToolJS = require("@redeakaa/tooljs).default;

After which you can export any of the libraries registered module, to use its methods.

// this exports all methods from the "Str", "Calc" and "Utils" modules.
var $ = ToolJS.export(["Str", "Calc", "Utils"]);

var total = $.add(10, 50, 40);
console.log(total);
// => 100

var toCamelCase = $.camelCase("Hello World from ToolJS");
console.log(toCamelCase);
// => "helloWorldFromToolJS"

var type = $.typeOf(400);
console.log(type);
// => "number"

You can optionally do a destructing import/require and choose out of the in-built modules to import

const { DOM, Obj, Str, Num, Calc, Utils } = require("@redeakaa/tooljs");

var capitalized = DOM.capitalize("hello world from toolJS");
console.log(capitalized);
// => "Hello World From ToolJS"

var obj = Obj.push({ name: "John Doe", age: 25 }, { gender: "Male" });
console.log(obj);
// => { name: "John Doe", age: 25, gender: "Male" }

For Browser usage, if you include the library using the first CDN provided above in a script tag, then you expose the ToolJS namespace to the window object.

// export all methods in all registered module
var _ = ToolJS.export();

// increment 10 by 5.
var val = _.increment(10, 5);
console.log(val);
// => 15

var odd = _.isOdd(27);
console.log(odd);
// => true"

// gets the element whose id = "#myElement"
var el = _.getEl("#myElement");

// creates a p tag, sets its innerText, applies some style to it and appends it to the body element.
_.createEl("p", {
  innerText: "Hello there! i was created using ToolJS",
  appendTo: "body",
  style: {
    color: "red",
    fontSize: "44px"
  }
});

You can optionally use the ES6 import syntax with the second CDN link provided to either import the libraries default export or any of the its named exports(the modules are the named exports).

var url = "https://unpkg.com/@redeakaa/tooljs@1.0.1/dist/esm/tooljs.esm.js";

import ToolJS from url;
import { Utils, Obj } from url;

// sets a cookie which expires in 14 days
Utils.setCookie("username", "John Doe", 14, "/");

// gets the cookie named "username"
var user = Utils.getCookie("username",);
console.log(user);
// => "John Doe"

var myObj = Obj.toObj(["John Doe", "Male"]);
console.log(myObj);
// => { 0: "John Doe", 1: "Male" }

This was just an introduction to ToolJS. It is one utility library that is sure to ease front-end development.

Here's a link to its official Documentation.

Other features of ToolJS which will be covered later in other posts includes.

• Optional Debugging.
• DOM Manipulation.
• ToolJS Plugin Creation.

Conclusion

This is an open-source collection of functions, methods and routine javascript operations which every front-end developer might have a use for at some point in their project.