Input masking in React
Today, we’ll show you how to input masking in React. The react-text-mask package is a useful tool for formatting and validating user input in a text field, such as phone...
The way to write your code
Cross-browser compatibility issues in JavaScript
Cross-browser compatibility is a challenge that web developers face when designing and building web applications. It refers to the need to ensure that a web application functions correctly across multiple...
Security concerns in JavaScript
JavaScript is a widely used programming language, but with its widespread use come security concerns. The following are some of the security issues to be aware of when working with...
Best Practices for Writing High-Quality JavaScript Code
Writing high-quality JavaScript code is essential for creating robust, maintainable, and efficient applications. Here are some best practices that can help you write high-quality JavaScript code: Follow a consistent coding...
Collaborating with others on a Git repository using pull requests and code reviews
Collaborating with others on a Git repository involves multiple people working on the same codebase and making changes to it. In such cases, it is important to have a proper...
Add a loading animation in React using react-spinners
Today, we’ll show you how to add a loading animation in React using react-spinners. react-spinners is a popular library for adding loading spinners in React applications. It provides a collection...
Rendering long lists using virtualization with React
Rendering long lists using virtualization with React is a technique for improving the performance of displaying large lists of items in a web application built using the React JavaScript library....
How to add icons in React
In this article, we will show you how to add icons in React using react-icons. React-icons is a library that provides a wide range of popular icon libraries (such as...
Add Instagram like stories in React
Today, we’ll show you how to add Instagram like stories in React. Here, we will create an example where we will design a React component similar to Instagram Stories. It...
Add presets to Date Range Picker in React
In this article, we’ll show you how to add presets to Date Range Picker in React. This example will help you to provide quick buttons in the picker to select...
How to run react app on a different port
If you have created a React project using create-react-app you will notice that the application will launch on the default 3000 port. But you can change it using environment file...
Validate dynamic array form in React using React Hook Form
Today, we’ll show you how to validate a dynamic array form in React using React Hook Form. Refer to the following article, if you don’t know how to create a...
Dynamic form with React Hook Form using useFieldArray
In this article, we will show you how to work with dynamic form with React Hook Form using useFieldArray in React. You may need to consider an array in form...
How to add a react-select dropdown with react-hook-form in React
In this article, we will show you how to add a react-select dropdown with react-hook-form in React. Similarly, you can implement other packages with a React Hook Form. Here, we...