Skip to content

Tips

Handy tips always at your fingertips

A collection of 123 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. Read tip

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. Read tip

Playground Application for JavaScript and Node.js

💡 Need to quickly test some JavaScript/Node.js code?

👉🏼 Just discovered @RunJS_app by @lukehaas and it's a game changer! Much better than opening VSCode, creating a test.js file and running "node test.js". 😅

https://runjs.app/

Read tip

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.

Read tip

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

Read tip

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. Read tip

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

Read tip

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. Read tip

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 ✅

Read tip