Snippets

There's nothing worse than almost remembering where you found that perfect snippet you desperately need in that moment. To reduce those moments I've started to collate the ones I've used or think could come handy.

Latest Snippets

Splitting Text

Sometimes it's easier to use a library. In this case we can use the splt library.

import splt from "https://cdn.skypack.dev/spltjs@1.0.8";
// any element with a class of 'splt' will be targeted by the script
splt({});

Splt also provide a useful example

Updated: April 29, 2022

Format with Prettier CLI

Sometimes you haven't got Prettier set up for your project yet (for whatever reason) and you want to format a bunch of files before you commit:

execute it from your terminal:

npx prettier --write path-to/your-files 

or add it into your package.json

"scripts": {
    "format": "npx prettier --write app"
}
Updated: April 4, 2022

Check if an Object is empty

Sometimes you need to know whether an Object is empty or not. This lil` snippet will sort you right out, and it's pretty simple too!

function isEmpty(object) {
  for (const property in object) {
    return false;
  }
  return true;
}
Updated: March 23, 2022

Update NPM Packages Interactively

Need to update a few packages quickly without typing them all out? Use the script below to quickly select the packages you want and update them all at once.

npx npm-check -u
Updated: March 18, 2022

toReadableDate

I hate having to think about converting dates into a human readable formate so I created a quick util function.

export const toReadableDate = (date: Date) => {
  const dateOptions: Intl.DateTimeFormatOptions = {
    year: 'numeric',
    month: 'long',
    day: 'numeric',
  }

  return new Date(date).toLocaleDateString('en-US', dateOptions)
}

In the future something like this will become even easier using JavaScript's proposed Temporal API

Updated: March 18, 2022