Understanding useMemo and useCallback in React
React is an amazing library for building user interfaces, but as your app grows, you might find yourself dealing with performance optimization challenges. Two key hooks, useMemo and useCallback, come...
Tagged: React Advanced
How to read data from the Streams API in React
In this article, we’ll show you how to read data from the Streams API in React. In the previous article, we have explained How to create a streaming API in...
How to cancel a Fetch request in React
In React, canceling a fetch request is a common requirement when dealing with asynchronous data fetching. One approach to achieve this is by utilizing the AbortController API, which provides a...
How to create a customizable loading indicator and placeholder in React using react-content-loader
React is a popular JavaScript library used for building web applications with dynamic user interfaces. When developing such applications, it is essential to have a good user experience. One aspect...
Animate marker on Google Maps route in React
Animating markers on Google Maps route in React can make the user’s experience more enjoyable and engaging. Google Maps API provides a way to animate the marker smoothly along the...
Move marker smoothly on Google Maps in React
In Google Maps, markers are often used to indicate locations or points of interest on the map. But what if you want to move the marker from one location to...
Draw a route between two points using Google Maps API in React
Drawing a route between two points is a common feature in many applications that rely on Google Maps API. It can be used for various purposes, such as showing directions...
How to add Google Maps in React using the package
In this article, you will learn how to add Google Maps in React using the @googlemaps/js-api-loader package. The package allows you to load the Google Maps JavaScript API asynchronously, making...
Draw a line between two points on google maps in React
Drawing a line between two points on Google Maps can be a useful feature in many applications, whether it is to show a route between two locations or to mark...
Redux toolkit with async API call using createAsyncThunk
In this redux toolkit article, we will show you how to create an async API call using createAsyncThunk action. In this example we will use Axios package for API call....
How to set up and use Redux Toolkit with React-Redux
Today, we will show you how to set up and use Redux Toolkit with React-Redux. You can improve your Redux code by using Redux Toolkit. Redux Toolkit allows us to...
Login form example with API using React Hooks
In this article, we will show you how to create a simple login form example with API using React Hooks. We created a similar example using react class component but...
Drag and Drop sortable list in React
In this article, we will show you how to implement drag and drop sortable list in React. If you have a list of any elements and you want to implement...
How to implement a line chart in React
In this article, we will explain to you how to implement a line chart in React. We’ll use the Highcharts package to build a line chart with ReactJS, just as...