8 Best Debugging Options To Crush Your React’s Bugs Like A Champ

Eli Elad Elrom
Master React
Published in
11 min readNov 2, 2020

--

When you working with a React App there are some specific useful tools you can use to debug and profile your React app when you run into problems.

Having the right tools for the job and knowing how to use them can remove paint points and expedite the process.

React is based on JavaScript and all the same tools that work for any JS-based App work, unlike other React-based frameworks such as Next.js or Razzle, CRA is out of the box, based on a single-page application (SPA), and to get better insights into what’s happening in our App there are specific tools that can help us debug our App easier. In this chapter, you will be equipped with the best tools that can help you get the job done.

Debugging is a common practice for detecting and removing errors (also called ‘bugs’) in your code that can cause undesired behavior. This section of the book is broken down into eight methods for debugging your app. You can use any one or a combination of a few together. It boils down to the bug you are trying to crush and the access you have to the code as well as where the code resigns. The debugging options I will be covering are as follow;

1. Console

2. Debugger

--

--