npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

kickstart-utils

v2.1.0

Published

Every project should kickstart with some basic utils :)

Downloads

10

Readme

kickstart-utils GitHub license

Every project should kickstart with some basic utils :)

From small projects to big, all of these utils are useful. with no dependencies!

Includes utils such as isEmpty, isObject, random, match, toDictionary and more.

PRs are more than welcome!

  1. Only utils and types that every project would use
  2. Which means, KISS (Keep It Simple, Stupid)
  3. No dependencies

Installation

npm install kickstart-utils

API

Utils

cn

Stands for class-names - returns a string removing anything unrelated to css class names.

import {cn} from 'kickstart-utils';

<div class={cn('foo', a && 'bar', b, 'baz')}/> // class="foo baz" 

isEmpty

Check if falsy (except 0) or empty object

import { isEmpty } from 'kickstart-utils';

isEmpty(null) // true
isEmpty(" ") // true
isEmpty([]) // true
isEmpty({}) // true

match

Instead of cumbersome switch case, match for cleaner, reusable code

import { match } from 'kickstart-utils';

const value = match("foo" , {
  foo: 2,
  bar: 3,
  default: 5
}) // 2

noop

For any time we need a noop function

import { noop } from 'kickstart-utils';

// noop = () => {}

<div onClick={noop}/> 

random

Random, or random between two numbers

import { random } from 'kickstart-utils'

random(4, 8) // 4, 5, 6, 7, 8

range

Creates a simple range from 0 to n

For more "complex" range, you can either use this range and map on it or create your own range

import { range } from 'kickstart-utils'

range(0) // []
range(5) // [0, 1, 2, 3, 4]

const fromToRange = (from, to) => range(to - from).map(i => i + from)
// There are some edge cases though, and the library should be as lean as possible
// so we keep it simple
const fromToRangeWithStep = (from, to, step) => range(to - from).reduce(
  (acc, i) => i < (to - from) / step ? [...acc, i * step + from] : acc, []
)

run

For the times we're not sure if the value is a function. For most cases, if we are sure the value is either a function or undefined, we can use myFunc?.(args).

import { run } from 'kickstart-utils';

const myFunc = (text) => 'hi' + text
run(myFunc, 'foo') // 'hi foo'
run('Not a function') // 'Not a function'

stopEventPropagation

Instead of event => event.stopPropagation()

import { stopEventPropagation } from 'kickstart-utils';

<input onChange={stopEventPropagation} />

toArray

Convert anything to an array

import { toArray } from 'kickstart-utils';

toArray(null) // [null]
toArray('hello') // ['hello']
toArray([1, 2, 3]) // [1, 2, 3]

toDictionary

Convert array of objects to a dictionary

import { toDictionary } from 'kickstart-utils';

const arr = [{ id: 1, name: 'foo' }, { id: 2, name: 'bar' }]
toDictionary(arr, 'id') // { 1: { id: 1, name: 'foo' }, 2: { id: 2, name: 'bar' } }

Type check (with ts type guards)

Most of them are self-explanatory.

isArray

import { isArray } from 'kickstart-utils';

isArray([]) // true

isBoolean

import { isBoolean } from 'kickstart-utils';

isBoolean("true") // false
isBoolean(true) // true

isError

import { isError } from 'kickstart-utils';

isError({message: "Error"}) // false
isError(Error()) // true

isFunction

import { isFunction } from 'kickstart-utils';

isFunction(() => {}) // true

isInteger

With an option to check on a string.

import { isInteger } from 'kickstart-utils';

isInteger(3.2) // false
isInteger("12", true) // true

isNullish

Nullish is a type that is either null or undefined.

isNumber

With an option to check on a string.

import { isNumber } from 'kickstart-utils';

isNumber(123.456) // true
isNumber(".123", true) // true

isObject

Check if is an object (not Array, or null)

import { isObject } from 'kickstart-utils';

isObject([{ foo: 'bar' }]) // false

isString

import { isString } from 'kickstart-utils';

isString("") // true

Types

Some common ts types

Nullish

import { Nullish } from 'kickstart-utils';

// Nullish = null | undefined

Primitive

js primitive types (no symbol)

import { Primitive } from 'kickstart-utils';

// Primitive = string | number | bigint | boolean | undefined | null