Skip to content

💡 Handy Tips

A collection of 124 tips that come in real handy when you need them. Originally posted as tweets on my Twitter account, and now gathered here so you can browse them easily.

Support ESM and CommonJS Uses of Your Library

💡 Writing a Node.js library using ES Modules instead of Common JS?

👉🏼 Support users who aren't using ESM by adding a mapping for the main export for your library in your package.json file.

Support ESM and CommonJS by setting exports[.].import for ESM and exports[.].require for CommonJS in package.json of your library.

Using ES Modules in Node.js

💡 In Node.js, you can use native ES Modules in two ways:

👉🏼 By using the ".mjs" extension or adding "type": "module" to your package.json.

❗️ Available from Node.js 13.2 and up.

Two ways to use ESM: 1. Use .mjs file extension, or 2. Add type: module to your package.json.

Github Notifications for New Releases

💡 Want to be notified when your favourite library has a new release?

👉🏼 You can now watch a @github repository *only* for release updates.

List Globally Installed NPM Libraries

💡 Want to list all the NPM libraries that are installed globally?

➡️ npm ls -g --depth=0

Or add an alias in ~/.bash_profile (bash) or ~/.zshrc (zsh): alias npmlsg='npm ls -g --depth=0'
➡️ npmlsg

Test CSS Selectors With DevTools

💡 Unsure whether your CSS selector will grab the correct HTML element on a page?

👉🏼 Devtools in Chrome allows you to quickly test a CSS selector string.

In the lower part of DevTools on the Elements tab, type your CSS selector and the corresponding HTML element will be selected.

Secure Your Cookies

💡 Working with cookies? Don't forget to secure them:

👉🏼 HttpOnly — no access from JavaScript (document.cookie API)
👉🏼 Secure — send cookie over HTTPS only
👉🏼 SameSite (Strict/Lax) — send only when current URL matches cookie URL

Restrict an Object in JavaScript

💡 In JavaScript, you can restrict the usage of an object in 3 ways:

👉🏼 preventExtensions() — ❌ add new props, ✅ modify and remove existing props
👉🏼 seal() — ❌ add or remove props, ✅ modify existing props
👉🏼 freeze() — ❌ add, remove or modify props

Object Restriction table with add, modify and remove property as rows and default, preventExtensions, seal and freeze functions as columns.

Run Locally Installed NPM Library

💡 Want to run a locally installed CLI library without adding it to npm scripts?

👉🏼 NPX will look into your node_modules/.bin/ folder before downloading from the web.

➡️ ./node_modules/.bin/eslint myfiles.js ❌
➡️ npx eslint myfile.js ✅