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.

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

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

Read tip

Front Matter CMS for VSCode

Just discovered https://frontmatter.codes 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 🤩

Read tip

Real-Time Collaboration With Dockside

💡Dockside allows you to spin up devcontainers (similar to Github Codespaces) hosted on your machine so you can code in real-time and collaborate with your colleagues 😮

https://github.com/newsnowlabs/dockside

Read tip

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

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

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 maximorlov.com homepage on desktop showing a red top navigation bar with a smooth transition to, an equally red, browser interface. Screenshot of maximorlov.com homepage on mobile showing a red top navigation bar with a smooth transition to, an equally red, mobile status bar. Read tip

Debug Requests Using a Mirror API

💡 Having a hard time writing an HTTP request in JavaScript?

➡️ Send it to Postman Echo without having to worry about authentication. This mirror API returns whatever you send it so you can build & debug requests on the go

https://learning.postman.com/docs/developer/echo-api/

Read tip

Colour Contrast for Accessibility

💡 Improve your accessibility score on @____lighthouse and the UX of your website with @Contrast_Finder

It checks the contrast between two colours and suggests close alternatives that satisfy the WCAG requirements ✅

https://app.contrast-finder.org/

Read tip

Convert cURL to JavaScript Fetch

💡 Are you often testing an external API with @getpostman or @GetInsomnia first before integrating in your app?

➡️ Make the transition easier by exporting the request to cURL, then use https://kigiri.github.io/fetch/ to convert to fetch API

Screenshot of https://kigiri.github.io/fetch/ with a cURL request to Twitter API at the top and the fetch equivalent at the bottom. Read tip