"I had to create an account to say a very big thank you! A very good article! works like magic!"
"Thanks!!!! This is the easiest answer I was looking for!!!"
"This is by far the simplest most elegant implementation of route animation"
Page Transition Effect in NextJS
This method may not be the best way for NextJS v12+ since new API is provided. Before we start...
Views: 21007Easy Lazy Loading with React & Intersection Observer API
I have updated my implementation of useIntersectionObserver hook, please refer to this post. In...
Views: 17725React-Router: Animated Transitions DIY
This post is based on React Router v5. What's the issue? React Router is a great...
Views: 9990Create an Image Magnifier with React
Today, let's create a simple image magnifier component. First, let's create the basic structure of t...
Views: 7844Infinite Scroll with React Hook & Intersection Observer
In this post, we going to use the useIntersectionObserver hook that I create in...
Views: 6646A simple way to use Web Worker with React-Create-APP - No eject needed
The problem of using Web Worker with an app that start with create-react-app is that: create-react-...
Views: 6019Create a Slideshow With React
Let's create a simple slideshow component today. It's easy and only take few steps to achieve. Here...
Views: 5322A Custom React Hook that handles duplicate API call
Today, we are going to create a custom hook that solve this problem: We have multiple components th...
Views: 5069A Clean Way to Conditionally Render Components
Today, I want to share a clean way to conditionally render child components while using React. It's...
Views: 5046We made a website to easily share links between our devices.
My partner and I made a website to make us easily share links between our...
Views: 2730Custom React Hook - useIntersection with Intersection Observer
This hook is an updated version from my previous Post interface IntersectionHookInit extends...
Views: 2478Steps to create a React Typescript library
Introduction This post will help you to publish your own react library to npm, so you can...
Views: 1340Dynamic Dimension React Container with Transition Effect - Part 1
The Issue Sometimes, we want our container to dynamically fit the size of its content, suc...
Views: 1155Dynamic Dimension React Container with Transition Effect - Part 2, Resize Observer
In part one, we create a dynamic dimension container that can handle child elements with static dimen...
Views: 1121Custom React Hook - useObjectState
A custom hook that make things easier with object state. function useObjectState(defaultValue = {}...
Views: 507Simple React Global State Management
Hi everyone! I recently created my own solution for managing global state in my web app. It's...
Views: 102Tips for AI-Assisted Web Development.
In this blog, we will examine how we can utilize the latest machine learning (ML) and artificial...
Views: 78