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.

Why cacheTime in React Query should always be bigger than staleTime

In React Query, the cacheTime and staleTime options impact how long data gets stored on the client and how often it's re-fetched from the server. Let's look at the difference between cacheTime and staleTime - and how changes to one can impact the other.

Written by Codemzy in ReactJS on November 21st, 2023

Cache busting a React app for production

If browsers save old code bundles for your React app, it can create errors and problems loading your app for your users. Here are some cache-busting tips for React in production.

Written by Codemzy in ReactJS on November 13th, 2023

React Query pagination with total count and total pages returned

This is how I store paginated queries when I also want users to know the total results count and total number of pages for paginated data.

Written by Codemzy in ReactJS on November 9th, 2023

7 drag and drop gotchas and how you can fix them

Drag and drop can be a little tricky to implement. Here are some common problems you might run into and how to fix them to get your drag-and-drop working like a charm.

Written by Codemzy in JavaScript on October 25th, 2023

Creating a Trello-like drag and drop kanban board in React

One of my favourite features of Trello is how you can drag and drop your cards around, so here's how I created a Trello-like drag-and-drop kanban board from scratch in React.

Written by Codemzy in ReactJS on October 20th, 2023

Building a reusable drag and drop component with React

Drag and drop is a pretty cool feature to add to your web applications. But it can be a little tricky. With some trial and error, here's how I built a reusable drag-and-drop component for React (and all the code!).

Written by Codemzy in ReactJS on October 19th, 2023

An easy way to backup your GitHub repositories (for free)

As I use a cloud IDE, sometimes the only copy of my code is in a GitHub repo. And that got me worried. Here's how I create a backup on Bitbucket.

Written by Codemzy in Code on October 12th, 2023

Do you build the front-end or back-end first in full-stack development?

I’m really interested to know how people take on a big full-stack project. Do you start with the front end (client) or the back end (server)? So I’ll share my approach - which is one small feature at a time - and why it works for me.

Written by Codemzy in Code on October 10th, 2023

When to use throttle vs debounce

Both throttling and debouncing are useful ways to slow down how often a function runs when it's called multiple times. Throttling allows a function to be called once during a timeframe, and debouncing calls a function once after the timeframe.

Written by Codemzy in JavaScript on October 6th, 2023

A function to make a word plural (or singular) in JavaScript

In this blog post, we will create a `toPlural` function that does slightly more than just add an "s" to the end of a word if the number is more than one!

Written by Codemzy in JavaScript on October 5th, 2023

How to scroll to an element after render in React (+ custom hook)

Here's how to scroll to an element after you render a component in React with `useRef` and `useEffect`. And if you need to do it more than once, I've included a custom `useScrollOnRender` hook you can use.

Written by Codemzy in ReactJS on September 29th, 2023

MongoDB findOneAndUpdate vs updateOne

There's more than one way to update a document in MongoDB. Here's when (and why) I use `findOneAndUpdate` instead of `updateOne` to update a document with MongoDB in Node.js.

Written by Codemzy in Node.js on September 26th, 2023

MongoDB findOneAndUpdate and how to know if it's an upsert

When you use the `upsert` option with `findOneAndUpdate` in MongoDB, it's not easy to know if the document was inserted or updated. Here's how I check if a document was created when returning the document before, or after the update.

Written by Codemzy in Node.js on September 25th, 2023

How to delete DigitalOcean Spaces files after X days with lifecycle rules

If you want to automatically have your files expire (and get deleted) from DigitalOcean Spaces after a certain number of days, you can do it with s3 lifecycle rules. You can’t set this up in the web interface, so here's the code you need to create the rule using Node.js.

Written by Codemzy in Node.js on September 22nd, 2023

Truthy vs falsy values in JavaScript

JavaScript converts values to true or false booleans in some contexts - like conditionals. A value that converts to true is a truthy, and one that converts to false is a falsy.

Written by Codemzy in JavaScript on September 21st, 2023

Parsing booleans in Express URL query parameters

When you send a query string `req.query` back to Express, true and false booleans are converted into strings. Here's why, and how I parse them back to booleans - but only sometimes!

Written by Codemzy in Node.js on September 20th, 2023

3 ways to pass a function as a prop in React

Here are three ways you can pass a function as a prop in React, with and without parameters - all while avoiding infinite loops!

Written by Codemzy in ReactJS on September 15th, 2023

Why does React render 0 with conditional `&&`?

In this blog post, I'll show you how to fix React rendering `0` in your `&&` conditions by using `!!` to convert it to a Boolean. But I'll also explain why it works so you can avoid this problem in the future!

Written by Codemzy in ReactJS on September 11th, 2023

React pagination component with all the code explained

Here's how I built a reusable pagination component with ReactJS, with next and previous buttons, that works with or without knowing the total number of pages available.

Written by Codemzy in ReactJS on September 1st, 2023

MongoDB pagination with skip, limit, and a next page trick

Paginating your data in MongoDB can be done in a single query, and it's kind of simple. But with this next page trick, you can know when you've fetched the last page of data, and avoid an empty results page.

Written by Codemzy in Node.js on August 29th, 2023

1
2
345

Categories