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.

How to Wait or Pause in Node.js

๐Ÿ’ก Looking for a native implementation of sleep/delay in Node.js? Well, here you go!

*Available from Node.js 15 and up

Native delay/sleep implementation by importing setTimeout from "timers/promises" core API and running with: await setTimeout(1000)

setTimeout Execution Time

๐Ÿ’ก A common misconception of setTimeout is:
"Execute this function in (exactly) x ms"

When in reality, you should think of it as:
"Execute this function no earlier than x ms"

setTimeout guarantees a *minimum* delay, but can't guarantee exact execution time

Front Matter CMS for VSCode

Just discovered by @eliostruyf and the idea of a built-in CMS right in your editor is genius! ๐Ÿ’ก

You can manage your articles & media. Create new articles from templates and preview them. I'm using it with @eleven_ty and it works great. Amazing ๐Ÿคฉ

What Is a Callback Function?

๐Ÿ’ก What is a callback function?

A function passed as an argument to another function in order to be called from *inside* that function.

Callback functions are often initialised anonymously and inlined in the function call.

Initialising two functions: printToConsole and getGreeting. printToConsole takes a single argument and console.logs it. getGreeting takes a string and a callback function as arguments and calls the callback function with "Hello" prepended to the string. Calling getGreeting with "Maxim" and printToConsole as arguments outputs: Hello Maxim Initialising a getGreeting function that takes two arguments: a name and a callback. getGreeting calls the callback function with "Hello" prepended to the name. Calling getGreeting with name="Maxim" and an inlined anonymous callback function which prints the argument to the console results in "Hello Maxim" as output

Skip to Content Link

๐Ÿ’กIncrease the accessibility of your website by adding a "Skip to content" link first thing after the opening body tag

It allows screen readers and keyboard users to jump straight to the content without having to go through other elements

An a tag with href="#main" right after the opening body tag. Followed by fictional navigation bar and headers, and then a main tag with id="main" holding the main content.

Using theme-color Meta Tag

๐Ÿ’ก Use the theme-color meta tag to create a seamless experience between the browser interface and your site's top nav bar:

โžก๏ธ <meta name="theme-color" content="#dc3838">

Works on Android (Chrome, Brave, Samsung) and iOS (Safari 15), as well as on desktop! (macOS Safari 15)

Screenshot of homepage on desktop showing a red top navigation bar with a smooth transition to, an equally red, browser interface. Screenshot of homepage on mobile showing a red top navigation bar with a smooth transition to, an equally red, mobile status bar.