Codemzy's Blog

Hello! I am Codemzy and I love to code. JavaScript is my favourite flavour. I blog about coding, software and my projects.

Using Array join() on an object property

You can use Array.join() on an array of objects, but `join()` will only work with strings, so you need to get the property value(s) first. Let's look at some examples.

Written by Codemzy in JavaScript on May 30th, 2023

How to prevent an icon wrapping to a new line with JavaScript

In this blog post, I create a javascript function to separate the last word in a string, so I can keep it attached to an inline icon, to prevent the icon from wrapping to a new line on its own.

Written by Codemzy in JavaScript on May 25th, 2023

How to sort an array of objects in JavaScript

You can sort any array of objects in JavaScript using the `sort()` method and giving it a compare function with the property value you want to sort by. Here's how it works with examples.

Written by Codemzy in JavaScript on May 22nd, 2023

Blog categories vs tags (and why you probably don’t need both)

Should you organise your blog posts into categories, with each post belonging to one category - or tags, where each post can have multiple tags? I don't have the answer, but hopefully this post can help you decide the best way forward!

Written by Codemzy in Deploy on May 15th, 2023

Simply the best blog URL structure

If you are starting a new blog, taking 5 minutes to decide on the best URL structure can help future-proof your content. Here are some good (and not-so-good) blog URL structures I've used, and why I choose super-simple.

Written by Codemzy in Deploy on May 12th, 2023

React Query isLoading vs isFetching (and when to use them)

What's the difference between `isLoading` and `isFetching` in React Query? When would you use one and not the other? Let's figure it out and show a nice loading spinner to our users.

Written by Codemzy in ReactJS on April 28th, 2023

Setting up ReactJS SPA routing/redirects on Cloudflare Pages

I ran into a few issues setting up a ReactJS app on Cloudflare Pages because only part of my website was a SPA (single-page application). Here's how I fixed routing and got my SPA to work.

Written by Codemzy in Deploy on March 29th, 2023

How to redirect the Cloudflare Pages URL (*.pages.dev) to your custom domain

Have you added a custom domain to your Cloudflare Pages site, but you can still access the site on `*.pages.dev`? Here's how I used Bulk Redirects to redirect the Cloudflare Pages URL to my custom domain.

Written by Codemzy in Deploy on March 17th, 2023

Scheduling Cloudflare Pages builds with cron triggers

How can you schedule static site builds? Run a cron job! And in Cloudflare, you don't even need to use any outside services to do it - you can trigger a worker to run on schedule, whenever you need!

Written by Codemzy in Deploy on March 14th, 2023

How to upload or disable pasting images in Tiptap

Once you add the Image extension to the Tiptap WYSIWYG editor, users can paste images in from HTML and the clipboard. That may (or may not be) what you want to happen. Here's how I handled image pasting in Tiptap.

Written by Codemzy in Code on February 27th, 2023

Debounce and cancel in ReactJS (+ useDebounce custom hook)

In the blog post, we'll create a useDebounce custom hook to delay function calls with React's useCallback and a little time travelling magic. We will also cancel our debounced function when the component unmounts or dependencies change.

Written by Codemzy in ReactJS on February 15th, 2023

Integrating Trello with Things 3 for team task collaboration

There are no collaboration or list-sharing features with Things 3. But it's a great personal task manager. Here's how we set up a Trello board and automations to use Things 3 with a small team.

Written by Codemzy in Software on February 6th, 2023

Adding drag and drop image uploads to Tiptap

Need to be able to drag and drop image files into your Tiptap WYSIWYG editor? Tiptap is highly customisable, so let's add some drag-and-drop magic to the Image extension.

Written by Codemzy in JavaScript on January 27th, 2023

How to generate a random unique ID with JavaScript

If you need a simple short ID and don't have any complex requirements for it, then a simple JavaScript function could be all you need. Here's the function I use to create a random unique ID in JavaScript, and an explanation of how it works.

Written by Codemzy in JavaScript on January 13th, 2023

Autosave user input in ReactJS with setInterval (+ useAutosave custom hook)

Here's a custom hook for adding an autosave feature to ReactJS, without ending up with stale data. It uses setInterval to trigger the save, useEffect to keep things clean, and useRef to keep your save functions fresh.

Written by Codemzy in ReactJS on December 16th, 2022

A future-proof Node.js express file/folder structure

How should we structure folders and files in Node.js? I was unhappy and slightly confused by the MVC approach, and wanted to move to a more colocation/feature-based structure. Here's what I came up with.

Written by Codemzy in Node.js on November 28th, 2022

Fine-tuning invalidateQueries with React Query (v4)

This post will cover how you can specify which queries to invalidate in ReactQuery with queryClient.invalidateQueries(). Here's how to target single queries, multiple queries, active queries and inactive queries.

Written by Codemzy in ReactJS on October 13th, 2022

Getting clients to reload your latest single page application version

When you deploy a new version of your single-page application (like ReactJS), you want your users to see it, right? But what if they have an old version open? Here's how you can force your user's browsers to refresh after releasing a new version of your web app.

Written by Codemzy in Deploy on September 16th, 2022

How to render an array of objects in ReactJS

If you try to render an array of objects in ReactJS, you might run into errors. Because ReactJS can't render the object. But you can loop over the array and turn it into something ReactJS can render, like a string or JSX.

Written by Codemzy in ReactJS on August 31st, 2022

How to use Array.map() on an object in JavaScript

Looping over arrays is fairly easy in JavaScript, but harder with objects, because you can't use array functions like `Array.map()`. Or can you?

Written by Codemzy in JavaScript on August 24th, 2022

2 3

5 6