How to Optimize React-query web app Performance

How to Optimize React-query web app Performance

If you’re building a web application that relies on slow, remote data sources, optimizing performance can be a challenge. Luckily, React-Query provides a powerful solution to this…

Test design breakpoints using jest and react-testing-library

Test responsive design using jest and react-testing-library

Testing design breakpoints in React applications is an important aspect of front-end development. It ensures that the components look and behave as expected on different screen sizes….

Testing React-Query with Jest and React-testing-library

Testing React-Query with Jest and React-testing-library

Introduction In this article we will cover the basic usage of testing useQuery hook from tanstack/react-query library, along with how to test it using jest and react-testing-library….

The basic guide for React Query useMutation hook

The basic guide for React Query useMutation hook

React Query is a popular library for fetching, caching, and updating asynchronous data in React applications. It provides a number of hooks, including useMutation that allows you…

Submit formik form using React-Query mutations

Submit formik form using React-Query mutations

In this article you will learn how to create forms using Formik library, and how to submit the forms using React-Query mutation hook. We will cover the…

useNavigate may be used only in the context of a component

useNavigate may be used only in the context of a component

If you’ve ever faced the following error in React: useNavigate() may be used only in the context of a component This error throws in useNavigate hook.  This happens…

 How To Dynamically load a JavaScript file in React

How To Dynamically load a JavaScript file in React

Introduction Some use cases require loading a specific Javascript script conditionally, this article will demonstrate how to dynamically load a javascript file in React once a particular…

How to invalidate query after mutations in React-Query

How to invalidate query after mutations in React-Query

Introduction Query invalidation is an essential part while working with React-Query. Usually, when there is a mutation in the app, there are queries related, and when a…

How to handle multiple queries with React-Query

How to handle multiple queries with React-Query

A super cool feature of React Query is that we can execute multiple queries in the same component, whether these queries are dependent or independent of each…