Introducing helping-js v2: A Zero-Dependency Utility Library to Level Up Your App

TL;DR — helping-js is a lightweight JavaScript utility library with no dependencies. It adds type checkers, regex patterns, schema-based validation, and safe browser APIs that work in Node, Vue, React, Express, and the browser. In this post, we’ll see how it can simplify your code.

---

Why helping-js?

• Zero dependencies — no extra packages
• Small — tree-shakeable, subpath imports
• Universal — Node (CJS/ESM), Vue, React, Express, Vite, Next.js, CRA, CDN
• TypeScript — .d.ts for all modules
• Validation — validate(obj, rules) without validator.js

Installation

npm install helping-js
# or
yarn add helping-js

---

Module Overview

1. Type checkers (helping-js/core/types)

Reliable type checks for common values:

import {
  isString,
  isNumber,
  isArray,
  isPlainObject,
  isUndefinedOrNull,
  isNumeric,
  isPromise,
} from 'helping-js/core/types';

isString('hello');        // true
isNumber(42);             // true
isArray([1, 2]);          // true
isPlainObject({});        // true
isUndefinedOrNull(null);  // true
isNumeric('123.45');      // true
isPromise(Promise.resolve()); // true

Useful for handling user input, API responses, and config objects.

---

2. Regex patterns (helping-js/core/regex)

Pre-built patterns for common formats:

import {
  RX_EMAIL,
  RX_URL,
  RX_PHONE,
  RX_IPV4,
  RX_UUID,
  RX_HEX_COLOR,
} from 'helping-js/core/regex';

RX_EMAIL.test('[e-mail]');   // true
RX_URL.test('https://example.com');  // true
RX_PHONE.test('[phone]');   // true
RX_IPV4.test('192.168.1.1');        // true
RX_UUID.test('550e8400-e29b-41d4-a716-446655440000'); // true
RX_HEX_COLOR.test('#ff5733');       // true

No need to write or maintain these regexes yourself.

---

3. Country-specific phone regex (helping-js/core/phones-regex)

import { RX_PHONE_US, RX_PHONE_UK, RX_PHONE_IR } from 'helping-js/core/phones-regex';

RX_PHONE_US.test('5552345678');    // true
RX_PHONE_UK.test('[phone]'); // true
RX_PHONE_IR.test('[phone]'); // true

Works for many countries.

---

4. Currency regex (helping-js/core/currencies-regex)

import { RX_CURRENCY_USD, RX_CURRENCY_EUR } from 'helping-js/core/currencies-regex';

RX_CURRENCY_USD.test('1,234.56');  // true
RX_CURRENCY_EUR.test('1.000,00€'); // true

For validating and normalizing currency input.

---

5. Environment support (helping-js/core/support)

Detect runtime environment:

import {
  HAS_WINDOW_SUPPORT,
  HAS_DOCUMENT_SUPPORT,
  IS_BROWSER,
  IS_IE,
} from 'helping-js/core/support';

if (IS_BROWSER) {
  console.log('Running in browser');
}
if (HAS_WINDOW_SUPPORT) {
  // use window
}

Helps write code that works in both browser and Node.

---

6. Safe browser globals (helping-js/core/safe-types)

Use window, document, navigator, etc. safely in SSR or Node:

import { WINDOW, DOCUMENT, File } from 'helping-js/core/safe-types';

// No ReferenceError in Node
console.log(WINDOW);   // {} in Node, window in browser
console.log(DOCUMENT); // {} in Node, document in browser

---

7. Validation API (helping-js/core/validate)

Lightweight schema-based validation:

import { validate } from 'helping-js/core/validate';
import { RX_EMAIL } from 'helping-js/core/regex';
import { isNumber } from 'helping-js/core/types';

const result = validate(
  { email: '[e-mail]', age: 25 },
  { email: RX_EMAIL, age: isNumber }
);

if (result.valid) {
  console.log('All valid');
} else {
  console.log('Errors:', result.errors); // { age: false }
}

Rules can be RegExp or (value) => boolean.

---

8. Form preset (helping-js/preset/form)

One import for common form validation needs:

import {
  validate,
  isString,
  isNumber,
  RX_EMAIL,
  RX_URL,
  RX_PHONE,
} from 'helping-js/preset/form';

---

Real-world examples

Vue 3 – form validation

<template>
  <form @submit.prevent="onSubmit">
    <input v-model="form.email" type="email" placeholder="Email" />
    <span v-if="errors.email" class="error">Invalid email</span>

    <input v-model.number="form.age" type="number" placeholder="Age" />
    <span v-if="errors.age" class="error">Invalid age</span>

    <button type="submit">Submit</button>
  </form>
</template>

<script setup>
import { ref, reactive } from 'vue';
import { validate, RX_EMAIL, isNumber } from 'helping-js/preset/form';

const form = reactive({ email: '', age: null });
const errors = ref({});

const rules = { email: RX_EMAIL, age: isNumber };

function onSubmit() {
  const result = validate(form, rules);
  errors.value = result.errors;
  if (result.valid) {
    // submit to API
    console.log('Submitting', form);
  }
}
</script>

---

React – form validation

import { useState } from 'react';
import { validate, RX_EMAIL, isNumber } from 'helping-js/preset/form';

export function ContactForm() {
  const [form, setForm] = useState({ email: '', age: '' });
  const [errors, setErrors] = useState({});

  const rules = { email: RX_EMAIL, age: isNumber };

  function handleSubmit(e) {
    e.preventDefault();
    const result = validate(form, rules);
    setErrors(result.errors);
    if (result.valid) {
      // submit to API
    }
  }

  return (
    <form onSubmit={handleSubmit}>
      <input
        value={form.email}
        onChange={(e) => setForm((s) => ({ ...s, email: e.target.value }))}
        type="email"
        placeholder="Email"
      />
      {errors.email && <span className="error">Invalid email</span>}

      <input
        value={form.age}
        onChange={(e) => setForm((s) => ({ ...s, age: e.target.value }))}
        type="number"
        placeholder="Age"
      />
      {errors.age && <span className="error">Invalid age</span>}

      <button type="submit">Submit</button>
    </form>
  );
}

---

Express.js – API validation

const express = require('express');
const { validate } = require('helping-js/core/validate');
const { RX_EMAIL } = require('helping-js/core/regex');
const { isString } = require('helping-js/core/types');

const app = express();
app.use(express.json());

app.post('/api/users', (req, res) => {
  const result = validate(req.body, {
    email: RX_EMAIL,
    name: (v) => isString(v) && v.length >= 2,
  });

  if (!result.valid) {
    return res.status(400).json({ errors: result.errors });
  }

  // create user...
  res.json({ ok: true });
});

// Reusable validation middleware
const validateBody = (rules) => (req, res, next) => {
  const result = validate(req.body || {}, rules);
  if (!result.valid) {
    return res.status(400).json({ errors: result.errors });
  }
  next();
};

app.post('/api/contact', validateBody({ email: RX_EMAIL }), (req, res) => {
  res.json({ ok: true });
});

---

Vue 3 – environment-aware logic

import { IS_BROWSER, HAS_TOUCH_SUPPORT } from 'helping-js/core/support';
import { isString } from 'helping-js/core/types';

// Use only in browser
if (IS_BROWSER && HAS_TOUCH_SUPPORT) {
  document.addEventListener('touchstart', handleTouch);
}

// Validate before processing
function processInput(value) {
  if (!isString(value)) return null;
  return value.trim();
}

---

React – type checking for API data

import { isPlainObject, isArray, isString } from 'helping-js/core/types';

function UserList({ data }) {
  if (!isArray(data)) return <p>Invalid data</p>;

  return (
    <ul>
      {data
        .filter((item) => isPlainObject(item) && isString(item.name))
        .map((user) => (
          <li key={user.id}>{user.name}</li>
        ))}
    </ul>
  );
}

---

How helping-js improves your app

Use case	Benefit
Form validation	Replace validator.js with validate() and built-in regex
Type safety	Use type checkers instead of typeof/instanceof checks
Regex validation	Reuse many common patterns instead of writing your own
SSR / universal code	IS_BROWSER and safe globals avoid runtime errors
Smaller bundle	Import only the modules you use
DX	TypeScript types and clear module layout

---

Links

• GitHub: github.com/parsajiravand/helping-js
• npm: npmjs.com/package/helping-js
• Docs: helping-js.netlify.app
• Changelog: CHANGELOG.md

---

If you found this useful, star the repo or leave feedback in the comments.

#vue #js #nodejs #express #utils #frontned #backend #web