These are posts about code I write. Expect lots of JavaScript, ReactJS and Regex content.
Once you know how to write a function in JavaScript, you also need to know how to call it. You can call it from your code, immediately, after an event, in your HTML, after a delay, or regularly. Let's see how.
Written by Codemzy in Code on April 20th, 2022
Although isMounted is deprecated in ReactJS, maybe you need it to prevent memory leak errors in your application. Learn why there are better ways to solve this problem, and how to create an isMounted hook with useEffect if you still need one.
Written by Codemzy in Code on April 13th, 2022
Moving over to ReactJS hooks? Good choice! But how do you use useEffect like componentDidMount? And how do you clean up your code afterwards? Learn how to create custom componentDidMount and componentWillUnmount hooks with useEffect.
Written by Codemzy in Code on April 6th, 2022
Naming your Webpack chunks helps you understand the contents of each bundle of code, and keep consistency between deploys. In this post, we look at named outputs, including dynamic imports, split chunks, and common chunks.
Written by Codemzy in Code on March 30th, 2022
Is Webpack telling you your business sizes are too big? Is all of your ReactJS code in a single app.js bundle? In this blog post, I look at why you should try code splitting and how to split your code up into smaller chunks.
Written by Codemzy in Code on March 23rd, 2022
Do you or your users get a ChunkLoadError after your deploy updates? If you use code splitting and dynamic imports, old code can cause this issue. Here's how to fix it in React.lazy() with a custom function.
Written by Codemzy in Code on March 16th, 2022
If you have a sticky or fixed position header with a textarea or a contenteditable element, the soft keyboard can push it off the screen on iOS devices. Not good if you need it to stay visible during editing. Here's how you can fix it.
Written by Codemzy in Code on March 9th, 2022
Do you need to create a drag and drop file upload component in React? This blog post has you covered. Build a component that listens to drag events, handles drops, and falls back to the traditional file picker.
Written by Codemzy in Code on March 2nd, 2022
Want the convenience of easy access to a sticker header, without it getting in your way all of the time? Here's how you can hide your sticky header when scrolling down, and get it back as soon as you scroll up!
Written by Codemzy in Code on February 23rd, 2022
In this blog post, I share a ReactJS hook you can use to listen to the scroll direction of the browser. Is the user going up or down the page? Now you can always know! Unless they stay still!
Written by Codemzy in Code on February 9th, 2022
Regex groups are super useful when you need to replace specific patterns in strings. In this blog post, discover how to use multiple groups to perform simple (and complex) replacements.
Written by Codemzy in Code on February 2nd, 2022
Take your regex further by breaking it down and accessing specific parts of your match with groups. Find out how you can create and use groups inside your regex with match() and matchAll().
Written by Codemzy in Code on January 12th, 2022
Transform your strings with regex, and be amazed at how your JavaScript code changes. This is the key to successfully tidying and validating your data. Regex will not only transform your code, it will change you and your strings too.
Written by Codemzy in Code on December 22nd, 2021
Image files can get big, so you might want to think about reducing image sizes when you let users upload photos on your website. Here's how you can use npm packages like sharp and multer to handle files and images in Node.js.
Written by Codemzy in Code on December 15th, 2021
Do you want to build a static website without learning another javascript framework? If you already know ReactJS, you can use it to create your static HTML content. It's quick and easy, and you won't even need to configure Webpack to do it! Use renderToStaticMarkup().
Written by Codemzy in Code on November 17th, 2021
Static sites means static content, right? But if you run a blog, you might want to schedule content to maximise your productivity and consistency. Let's look at how you can schedule your posts for the future by adding dates and updating your build process.
Written by Codemzy in Code on November 10th, 2021
NaN isn't something you will often (if ever) write into your code. But it can crop up from time to time. And when it does, you can't check for it in the same way you could check for other values. Because NaN does not equal NaN. Are you confused? Don't be! Let's get to know NaN.
Written by Codemzy in Code on October 25th, 2021
Dark Mode has taken over our devices, and now it's taking over the internet. Mostly at night time. It is possible to add Dark Mode to a static site without white flashes or impacting performance. Here's how I added Dark Mode to a static site with a little bit of JavaScript.
Written by Codemzy in Code on October 18th, 2021